Viewing 30 results - 691 through 720 (of 11,220 total)
  • Author
    Search Results
  • #1411712

    Hi Mike,

    Morning.
    But I cannot find the avia-post-nav on my quick CSS:
    here is the code I have right now:
    .entry-content blockquote {
    margin: 1.5em 0em!important;
    font-size: 137%!important;
    color: rgb(58, 140, 174)!important;
    font-style: italic!important;
    background: #efefef!important;
    padding: 1em!important;
    text-align: left!important;
    quotes: “\201C””\201D””\2018″”\2019”;
    }

    .entry-content blockquote:before {
    color: #ccc;
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
    }
    .entry-content blockquote p {
    display: inline;
    }

    .footer_color {
    border: none;
    }

    /* Generated by Font Squirrel (//www.fontsquirrel.com) on April 15, 2015 */

    @font-face {
    font-family: ‘verbextralight’;
    src: url(‘/webfonts/extralight-webfont.eot’);
    src: url(‘/webfonts/extralight-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/extralight-webfont.woff2’) format(‘woff2’),
    url(‘/webfonts/extralight-webfont.woff’) format(‘woff’),
    url(‘/webfonts/extralight-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/extralight-webfont.svg#verbextralight’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    /*
    @font-face {
    font-family: ‘verbregular’;
    src: url(‘/webfonts/regular-webfont.eot’);
    src: url(‘/webfonts/regular-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/regular-webfont.woff2’) format(‘woff2’),
    url(‘/webfonts/regular-webfont.woff’) format(‘woff’),
    url(‘/webfonts/regular-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/regular-webfont.svg#verbregular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘verbsemibold’;
    src: url(‘/webfonts/semibold-webfont.eot’);
    src: url(‘/webfonts/semibold-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/semibold-webfont.woff2’) format(‘woff2’),
    url(‘/webfonts/semibold-webfont.woff’) format(‘woff’),
    url(‘/webfonts/semibold-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/semibold-webfont.svg#verbsemibold’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘verbcondlight’;
    src: url(‘/webfonts/yellow-design-studio-verbcondlight-webfont.eot’);
    src: url(‘/webfonts/yellow-design-studio-verbcondlight-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/yellow-design-studio-verbcondlight-webfont.woff’) format(‘woff’),
    url(‘/webfonts/yellow-design-studio-verbcondlight-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/yellow-design-studio-verbcondlight-webfont.svg#verbcondlight’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }*/

    @font-face {
    font-family: ‘verbcondregular’;
    src: url(‘/webfonts/yellow-design-studio-verbcondregular-webfont.eot’);
    src: url(‘/webfonts/yellow-design-studio-verbcondregular-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/yellow-design-studio-verbcondregular-webfont.woff’) format(‘woff’),
    url(‘/webfonts/yellow-design-studio-verbcondregular-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/yellow-design-studio-verbcondregular-webfont.svg#verbcondregular’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    @font-face {
    font-family: ‘verbcondsemibold’;
    src: url(‘/webfonts/yellow-design-studio-verbcondsemibold-webfont.eot’);
    src: url(‘/webfonts/yellow-design-studio-verbcondsemibold-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘/webfonts/yellow-design-studio-verbcondsemibold-webfont.woff’) format(‘woff’),
    url(‘/webfonts/yellow-design-studio-verbcondsemibold-webfont.ttf’) format(‘truetype’),
    url(‘/webfonts/yellow-design-studio-verbcondsemibold-webfont.svg#verbcondsemibold’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }
    /*
    html, body, div, p { font-family: ‘verbregular’; }
    h1, h2, h3, h4, h5, h6, strong { font-family: ‘verbsemibold’; font-weight: normal;text-transform:none!important; }*/

    html, body, div, p { font-family: ‘verbcondregular’; }
    h1, h2, h3, h4, h5, h6, strong { font-family: ‘verbcondsemibold’; font-weight: normal;text-transform:none!important; }

    .button-transition-blue {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    }

    .button-transition-blue:hover {
    background:#3a8cae!important;
    }

    .big-thin {
    font-size: 1.6em;
    line-height:1.2em;
    font-family:’verbextralight’;
    color:white;
    }

    .image-overlay {
    visibility: hidden;
    }

    #top #wrap_all .header_color .av-menu-button-colored > a .avia-menu-text {
    background: #f9a456!important;
    border: 0px solid white;
    }

    .big-thin span.av_font_icon.avia_animate_when_visible.av-icon-style-.avia-icon-pos-left.avia_start_animation.avia_start_delayed_animation {
    padding-bottom: 100px;
    }

    @media only screen and (max-width: 767px) {

    .big-thin span.av_font_icon.avia_animate_when_visible.av-icon-style-.avia-icon-pos-left.avia_start_animation.avia_start_delayed_animation {
    padding-bottom: 20px;
    }
    }

    .big-thin span.av-icon-char {
    line-height: 1em!important;
    margin-right: 10px;
    }

    #top .av_header_transparency #header_meta {
    border:none;
    }

    div#content {border-color:transparent!important;}

    #top .chatlio-widget textarea {
    line-height: unset!important;
    min-height: unset!important;
    }

    /*this changes the width of the tabs */

    .av-inner-tab-title {
    width: 200px !important;
    font-size: 13px !important;
    font-weight: medium !important;
    }

    /*this adjusts the tab arrow */

    .av-tab-arrow-container {
    width: 200px !important;
    }

    /*this CSS styles the scroll down arrow */
    #top .scroll-down-link {
    /*color: #f9a456 !important; */
    font-size: 150px;

    }

    /* This styles the animated icon list on the PS page */

    .card-container {
    cursor: pointer;
    height: 530px;
    perspective: 600;
    position: relative;
    width: 100%;
    margin-bottom: 25px ;
    }

    .card {
    height: 100%;
    position: absolute;
    border-radius: 6px;
    transform-style: preserve-3d;
    transition: all 1s ease-in-out;
    width: 100%;
    }

    .card:hover {
    transform: rotateY(180deg);
    }

    .card .side {
    backface-visibility: hidden;
    border-radius: 6px;
    height: 530px;
    position: absolute;
    overflow: hidden;
    width: 100%;
    }

    .card .back {
    padding: 20px;
    background: #eaeaed;
    color: #606a71;
    line-height: 20px;
    text-align: left;
    transform: rotateY(180deg);
    }

    /* the following css snippets adjust the icon list that is on the PS page */
    .horizontal-icon-list ul.avia-icon-list li {
    float: left;
    clear: none;
    width: 20%;
    }

    .horizontal-icon-list .iconlist-timeline {
    display: none;
    }

    div.description {
    position:absolute; /* absolute position (so we can position it where we want)*/
    bottom:0px; /* position will be on bottom */
    left:0px;
    width:100%;
    /* styling bellow */
    background-color: #eaeaed;
    color: #606a71;
    }

    p.description_content{
    padding:10px;
    margin:0px;
    font-size: 15px;
    }

    @font-face {
    font-family: ‘Font Awesome 5 Free’;
    font-style: normal;
    font-weight: 900;
    font-display: auto;
    src: url(“../webfonts/fa-solid-900.eot”);
    src: url(“../webfonts/fa-solid-900.eot?#iefix”) format(“embedded-opentype”), url(“../webfonts/fa-solid-900.woff2”) format(“woff2”), url(“../webfonts/fa-solid-900.woff”) format(“woff”), url(“../webfonts/fa-solid-900.ttf”) format(“truetype”), url(“../webfonts/fa-solid-900.svg#fontawesome”) format(“svg”); }

    .fa,
    .fas {
    font-family: ‘Font Awesome 5 Free’;
    font-weight: 900; }

    @media only screen and (max-width: 700px) {
    .cta_text_block p {
    line-height: 1.5em;
    }

    }

    @media only screen and (max-width: 700px) {
    .section_heading h2 {
    line-height: 1.5em;
    }

    }

    /* this targets the Learn More btn on the Tech services page */
    .sleeknote-btn {
    display: flex;
    /*justify-content: space-around;*/
    }

    /* this adjusts the padding on the Tech services page */
    .custom-btn-slknte {
    padding-right: 10px;
    }

    /* This removes the comments from the blog */
    .slide-content .slide-meta .slide-meta-comments a, .slide-content .slide-meta .slide-meta-del {
    display: none;
    }

    /* Centers the text on blog page */
    .hero-blog-entry-center {
    text-align: center;
    }

    .hero-blog-entry-center .read-more-link {
    display: block;
    text-align: center;
    margin: 30px auto 20px auto;
    clear: both;
    width: 150px;
    border: none;
    border-style: solid;
    border-width: 2px;
    border-color: #3a8cae;
    padding: 10px 0;
    border-radius: 5px;
    }

    .hero-blog-entry-center .read-more-link .more-link-arrow {
    display: none;
    }

    .new-blog .av-masonry-entry .av-inner-masonry-content {
    height: 158px;
    }

    .logo-bg {
    position: absolute;
    top: 400px;
    right: -400px;
    opacity: 0.05;
    z-index: -10;
    transform: rotate(-30deg);
    }

    /*—————————————-
    // CSS – Content Slider style – 2
    //————————————–*/

    /* Slider Background */
    #top .av-contentslider-style-2 {
    margin: 20px 50px;
    background: #ffffff;
    }

    /* Arrow position */
    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls {
    width: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    z-index: 999;
    }

    /* Right arrow*/
    .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls .next-slide {
    right: -35px !important;
    }
    /* Arrow icon */
    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls a.next-slide:before{
    content:’\e875′;
    }

    /* Left arrow */
    .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls .prev-slide {
    left: -35px !important;
    }
    /* Arrow icon */
    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls a.prev-slide:before{
    content:’\e874′;
    font-family: ‘entypo-fontello’;
    }

    /* Common arrow styles */
    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls a {
    border-radius: 25px;
    color:#fff;
    font-weight: bolder;
    font-size: 24px;
    background: #f9a456;
    width: 30px;
    height: 30px;
    }

    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls a:before {
    background: transparent;
    top:3px;
    }

    /* Arrow hover style */
    #top .av-contentslider-style-2 .avia-slideshow-arrows.avia-slideshow-controls a:hover {
    opacity: 1;
    background: #fab677;
    }

    .testimonial-cta {
    background-color: rgba(255, 255, 255, 0.9);
    }

    /* .testimonial-col {
    height: 400px;
    } */

    /* enfold social media icons fix */
    .social_bookmarks_twitter a::before, .av-social-link-twitter a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_facebook a::before, .av-social-link-facebook a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_linkedin a::before, .av-social-link-linkedin a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_pinterest a::before, .av-social-link-pinterest a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_tumblr a::before, .av-social-link-tumblr a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_reddit a::before, .av-social-link-reddit a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_vk a::before, .av-social-link-vk a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_gplus a::before, .av-social-link-gplus a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_mail a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_dribble a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_youtube a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_instagram a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }
    .social_bookmarks_vimeo a::before {
    font-family: ‘entypo-fontello’;
    content: ‘’;
    }

    /* end enfold social media icons fix */

    .standards-solutions-container {
    display: flex;
    justify-content: space-evenly;
    }

    .standards-text-container {
    width: 500px;
    }

    .testimonial-container {
    display: flex;
    justify-content: space-evenly;
    }

    .img-container-test {

    }

    .text-container-test {
    width: 500px;
    margin-right: -60px;
    }

    .solutions-hover:hover {
    -ms-transform: translate(0, -5px);
    transform: translate(0, -5px);
    transition: 0.3s ease-in-out;
    cursor: pointer;
    }

    .hero-ul-list {
    width: 400px;
    margin-bottom: 40px;
    column-count: 2;
    padding: 0;
    }

    .hero-ul-list li {
    line-height:1.5em;
    float:left;
    list-style-type: square;
    }

    /* NEW EDIT */

    h1.headerh1 {
    position: absolute;
    top: 100px;
    z-index: 9999;
    text-align: center;

    }
    #product-feature .flex_column {
    width: 40%;
    }
    /* CSS Code by Agus */

    @media all and (min-width:1025px){
    .hero-content{
    min-height:863px !Important;
    }
    }

    /*.home-heading h1{
    font-family:’verbregular’ !important;
    font-size:38px !important;
    color:#fff !important;
    text-align:center;
    line-height:1.4em;
    letter-spacing:-0.5px !Important;
    margin-bottom:20px !important;
    }*/

    .home-heading h1{
    font-family:’verbcondregular’ !important;
    font-size:38px !important;
    color:#fff !important;
    text-align:center;
    line-height:1.4em;
    letter-spacing:-0.5px !Important;
    margin-bottom:20px !important;
    }

    .home-heading span.orange,
    .main-heading span.orange{color:#f69345 !important}

    .btn-product-tour span:before{
    background:#fff !Important;
    padding:9px;
    border-radius:30px;
    border:1px solid #fff !important;
    color:#f69345 !important;
    }

    .btn-product-tour:hover span:before{
    border:1px solid #f69345 !important;
    }

    .btn-product-tour .avia_iconbox_title{
    margin-right:5px;
    font-weight:600 !important;
    }

    .hero-image img{
    margin-top:-485px !important;
    margin-bottom:-150px;
    }

    .general-button span{
    font-family: ‘Poppins600’ !important;
    font-weight: 600 !important;
    }

    .products .entry-content-wrapper{
    max-width:1100px;
    margin:0 auto;
    }

    #products{
    background: radial-gradient(50% 50% at 50% 50%, #3E91BA 0%, #1D62A0 100%), #2F799E;
    }

    .main-heading h3{
    font-family: ‘verbsemibold’ !important;
    font-weight: 600 !important;
    }

    /*.main-heading span.special_amp{
    font-family:”verbregular” !Important;
    font-size:1em !important;
    font-style:normal !Important;
    }*/

    .main-heading span.special_amp{
    font-family:”verbcondregular” !Important;
    font-size:1em !important;
    font-style:normal !Important;
    }

    .features{
    height:400px !important;
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(29px);
    border-radius: 10px;
    transition: all 0.2s ease-in-out;
    border: 1px solid #5597bf;
    }

    .features p{
    margin-right:80px !important;
    }

    .features:hover{
    background:#fff !important;
    }
    .features:hover h2{
    color:#f69345 !important;
    }

    .features:hover h4{
    color:#000 !important;
    }
    .features:hover p{
    color:#4d4d4d !important;
    }
    .products .flex_column_table{
    margin-top:70px !important;
    }

    .content-slider{
    overflow:visible !Important;
    }

    .content-slider .avia-content-slider-inner{
    max-width:1140px !Important;
    margin:0 auto;
    }

    .content-slider .slide-entry{
    border-radius: 10px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #00000026;
    padding:12px;
    }

    .content-slider .slide-entry img{
    border-radius:10px !Important;
    }

    .content-slider .slide-entry h3{
    font-family:Roboto, sans-serif !important;
    color: #051728 !important;
    font-size: 22px !important;
    font-weight: 600;
    line-height: 33px;
    margin-top: 4px;
    max-height:98px;
    overflow:hidden;
    }

    .content-slider a.more-link{
    font-family: “Roboto”, Sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    padding: 0px 0px 0px 0px;
    border-radius: 0px;
    color: #458350;
    margin-top: 5px;
    }

    .content-slider .slide-content{
    padding:10px !important;
    }

    .content-slider .avia-content-slider-inner{
    overflow:visible !Important;
    }

    .content-slider .av_one_third,
    .success-story .av_one_third{
    margin-left: 3%;
    width: 31.333333333333332%;
    }

    .content-slider .av_one_third.first,
    .success-story .av_one_third.first{
    margin-left:0px !important;
    }

    .content-slider .avia-slideshow-arrows a.next-slide{ right: -40px !important}

    .content-slider .avia-slideshow-arrows a.prev-slide{ left: -40px !important}

    .content-slider .avia-slideshow-arrows a.next-slide,
    .content-slider .avia-slideshow-arrows a.prev-slide{
    border-radius: 50px !important;
    font-size: 16px !important;
    height: 41px !important;
    width: 41px !important;
    }

    .content-slider .avia-slideshow-arrows a:before{
    border-radius:50px !Important;
    line-height: 41px !important;
    background:#f69345 !Important;
    color:#fff !Important;
    border:1px solid #f69345;
    }

    .content-slider .avia-slideshow-arrows a:hover:before{
    background:#fff !important;
    color:#f69345 !important;
    }

    .content-slider .avia-slideshow-arrows a{
    top:50% !important;
    opacity:1 !important;
    }

    .success-story h3{
    display:none !Important;
    }

    /*.success-story h2{
    font-family:’verbregular’ !important;
    color:#051728 !important;
    line-height:1.4em !Important;
    margin-top:0px !Important;
    font-weight:600;
    -webkit-font-smoothing:antialiased;
    }*/
    .success-story h2{
    font-family:’verbcondregular’ !important;
    color:#051728 !important;
    line-height:1.4em !Important;
    margin-top:0px !Important;
    font-weight:600;
    -webkit-font-smoothing:antialiased;
    }

    .success-story p{
    font-size:16px !important;
    }

    .success-story a.read-more{
    color: #458350;
    font-family: “Vern font”, Sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    position:absolute;
    bottom:17px;
    }

    .success-story .slide-entry{
    min-height:463px;
    border-radius:10px;
    padding:15px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #D9D9D9;
    transition: background 0s, border 0s, border-radius 0s, box-shadow 0s !Important;

    }

    .success-story .slide-entry-wrap{
    padding:0px 20px;
    margin:0 auto !Important;
    }

    .success-story .avia-slideshow-arrows {
    position: absolute !important;
    width: 100% !important;
    top: 50% !important;
    left: 0;
    height: 41px;
    }

    .success-story .avia-slideshow-arrows a{
    height:41px !Important;
    width:41px !important;
    line-height:41px !important
    }

    .success-story .avia-slideshow-arrows a:before{
    line-height:41px !important;
    font-size:16px !important
    }

    .success-story a:before{
    border:none !Important
    }

    .success-story a.prev-slide{
    left:-40px;
    }

    .success-story a.next-slide{
    right:-40px !important;
    }
    .success-story a.prev-slide, .success-story a.next-slide{
    min-width:41px !important;
    border-radius:50px;
    border:1px solid #f69345 !Important;
    background:#f69345 !important;
    color:#fff !important;
    }

    .success-story a.prev-slide:hover, .success-story a.next-slide:hover{
    background:#fff !important;
    color:#f69345 !important;
    opacity:1 !important;
    }

    .home-subscribe{
    background: rgb(255,255,255) !important;
    background: linear-gradient(180deg, rgba(255,255,255,0) 75%, rgba(29,98,160,1) 75%) !important;
    }

    .home-footer{
    background: radial-gradient(50% 50% at 50% 50%, #3E91BA 0%, #1D62A0 100%), #2F799E;
    }

    .home-footer img{
    width:174px !Important;
    }
    .home-footer .avia-image-container{
    text-align:left !important;
    margin-bottom:20px;
    }

    .home-footer p{
    font-size:16px;
    color:#BED3E4;
    padding-right:100px;
    }

    .home-footer h3{
    font-size:20px !important;
    color:#ffffff !important;
    margin-bottom:20px !important;
    }

    /*.home-footer h5{
    font-family:”verbregular” !Important;
    font-size:16px !important;
    color:#ffffff !important;
    margin-bottom:20px !important;
    }

    .home-footer h6{
    font-family:”verbregular” !Important;
    font-size:14px !important;
    color:#ffffff !important;
    }*/

    .home-footer h5{
    font-family:”verbcondregular” !Important;
    font-size:16px !important;
    color:#ffffff !important;
    margin-bottom:20px !important;
    }

    .home-footer h6{
    font-family:”verbcondregular” !Important;
    font-size:14px !important;
    color:#ffffff !important;
    }

    .home-footer li{border-width:0px !Important}
    .home-footer li a{font-size:14px !important;color:#D8E9F1 !Important;padding:5px 0px !important;line-height:1.5em !Important}

    .home-footer li a:hover{background:transparent !Important;color:#D8E9F196 !important}

    .home-footer .av-share-box ul li a{
    width:38px !Important;
    height:38px !important;
    margin-right:12px;
    padding-top: 10px !important;
    background: #f69345 !important;
    }

    .home-footer .av-share-box ul li:hover a{
    margin-top:-10px !important;
    }

    .home-copyright{
    border-top:1px solid #fff !Important;
    padding-top:25px;
    }

    .home-footer .template-page{
    padding-bottom:20px !Important;
    }

    @media all and (max-width:1024px){
    .features p{margin-right:0px !important}
    .avia-section-huge .content{padding-top:60px !important;padding-bottom:60px !Important}
    .main-heading{margin-bottom:20px !Important;padding-bottom:0px !Important}
    .home-footer p{padding-right:50px !Important}
    .hero-content{min-height:720px !Important}
    }
    @media all and (max-width:767px){
    .home-heading h1{font-size:32px !important;line-height:1.2em !Important;}
    .hero-content{padding:40px 25px 25px 25px !important}
    .hero-image img{margin-top:-185px !important}
    .hero-content{min-height:auto !Important}
    .infographic{padding:0px !important}
    #domain-expertise .av_one_half,
    #professional-services .av_one_half,
    #innovative-software .av_one_half{padding:0px !Important}
    .products .av_one_half{padding:25px !important}
    .products .first{margin-bottom:85px !Important;overflow:hidden;}
    .home-subscribe {
    background: rgb(255,255,255) !important;
    background: linear-gradient(180deg, rgba(255,255,255,0) 85%, rgba(29,98,160,1) 85%) !important;
    }
    }

    Hi,
    That worked, thanks.
    So the space was created by the columns and other elements above have negative top margins for the overlay affect so by the time we get to your headline rotator there is a large gap:
    Enfold_Support_2449.jpeg
    so to correct I added a negative bottom margin to the last column row above the headline rotator, please note that this is for the desktop version only:
    Enfold_Support_2451.jpeg
    tablet and mobile seems fine as is, but you can adjust for these if you wish by choosing those buttons:
    Enfold_Support_2453.jpeg

    Best regards,
    Mike

    #1411583

    Hey Stefan,

    Assuming that this is a Pricing Table element and you want to add a different link to each inner table:
    Enfold_Support_2443.jpeg
    First add the custom class table-link to the table element developer settings:
    Enfold_Support_2441.jpeg
    Then add this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function custom_script() { ?>
      <script>
    (function ($) { 
        $(".table-link .pricing-table-wrap:first-child").wrap(function() {
           var link = $('<a/>').css({'display':'table','width':'33%','float':'left'});
           link.attr('href', 'https://google.com');
           return link;
        });
        $(".table-link .pricing-table-wrap:nth-child(2)").wrap(function() {
           var link = $('<a/>').css({'display':'table','width':'33%','float':'left'});
           link.attr('href', 'https://duckduckgo.com');
           return link;
        });
        $(".table-link .pricing-table-wrap:nth-child(3)").wrap(function() {
           var link = $('<a/>').css({'display':'table','width':'33%','float':'left'});
           link.attr('href', 'https://bing.com');
           return link;
        });
    })(jQuery);
    </script>
      <?php
    }
    add_action('wp_footer', 'custom_script');

    note that each of the three inner tables have a different URL
    While this works, it has a drawback that the link changes the display of the table which changes the width, the script adds a hard width to the table to correct this issue but then it is not very response. Perhaps you don’t mind this, but I recommend just using the button that is in the table for your links.

    Best regards,
    Mike

    Thanks very much for your suggestion, Mike. It helped me look quite deeply into this issue using Chrome’s debugger. I want to first apologise to you for keeping things so complicated using my in-development home page, which is quite complicated, instead of creating a test page for this topic question–which is exactly what I did to debug this issue after your reply.

    It turns out that the stackoverflow suggestion doesn’t work. Their suggestion is to add itemOpts.index = index; before the mfp._openClick({mfpEl:items}, jqEl, itemOpts); line as follows:

    $.fn.magnificPopup = function(options) {
    	_checkInstance();
    
    	var jqEl = $(this);
    
    	// We call some API method of first param is a string
    	if (typeof options === "string" ) {
    
    		if(options === 'open') {
    			var items,
    				itemOpts = _isJQ ? jqEl.data('magnificPopup') : jqEl[0].magnificPopup,
    				index = parseInt(arguments[1], 10) || 0;
    
    			if(itemOpts.items) {
    				items = itemOpts.items[index];
    			} else {
    				items = jqEl;
    				if(itemOpts.delegate) {
    					items = items.find(itemOpts.delegate);
    				}
    				items = items.eq( index );
    			}
    			itemOpts.index = index;  // Added line per https://stackoverflow.com/questions/49131727/open-all-images-on-page-with-magnific-popup
    			mfp._openClick({mfpEl:items}, jqEl, itemOpts);
    		} else {
    			if(mfp.isOpen)
    				mfp[options].apply(mfp, Array.prototype.slice.call(arguments, 1));
    		}
    
    	} else {
    		// clone options obj
    		options = $.extend(true, {}, options);
    
    		/*
    		 * As Zepto doesn't support .data() method for objects
    		 * and it works only in normal browsers
    		 * we assign "options" object directly to the DOM element. FTW!
    		 */
    		if(_isJQ) {
    			jqEl.data('magnificPopup', options);
    		} else {
    			jqEl[0].magnificPopup = options;
    		}
    
    		mfp.addGroup(jqEl, options);
    
    	}
    	return jqEl;
    };

    The problem is that that bug fix never even gets to run because it’s encapsulated within the IF condition of typeof options === “string”, as you can see above. So if you look at BOTH:

    (1) us Enfold users:

    links.not(options.exclude).addClass('lightbox-added')
    .magnificPopup($.avia_utilities.av_popup);

    where $.avia_utilities.av_popup === {type: ‘image’, mainClass: ‘avia-popup mfp-zoom-in’, tLoading: ”, tClose: ”, removalDelay: 300, …}

    (2) and the Original Poster to that stackoverflow thread:

    $('#content').magnificPopup({
      items: $imgs,
      type: 'image',
      gallery: {
        enabled: true
      },
    });

    you can see that typeof options === “object”! So it wouldn’t work for either of us (the OP coincidentally was wanting to do the exact same thing as me, to “enable magnific popup on all images on my page”). Unfortunately, the OP never responded to the reply person’s bug fix suggestion, so the thread never went further in order to highlight the failure of the suggestion for the OP.

    After ruling out magnific’s code as the culprit of my problem, I focused on avia-snippet-lightbox.js and its code at the end of its function, $.fn.avia_activate_lightbox = function(variables):

    return this.each(function()
    {
        var container	= $(this),
            videos		= $(options.videoElements, this).not(options.exclude).addClass('mfp-iframe'), /*necessary class for the correct lightbox markup*/
            ajaxed		= ! container.is('body') && ! container.is('.ajax_slide');
            for( var i = 0; i < options.groups.length; i++ )
            {
                container.find(options.groups[i]).each(function()
                {
                    var links = $(options.autolinkElements, this);
    
                    if( ajaxed )
                    {
                        links.removeClass('lightbox-added');
                    }
    
                    links.not(options.exclude).addClass('lightbox-added').magnificPopup($.avia_utilities.av_popup);
                });
            }
    
    });

    Sure enough, this is the culprit. What’s happening in this code above is that:

    (1) the outer loop, controlled by the FOR loop, searches the <body> DOM for each class in the options object (.avia-slideshow, .avia-gallery, .av-horizontal-gallery, .av-instagram-pics, .portfolio-preview-page, .portfolio-preview-content, .isotope, .post-entry, .sidebar, #main, .main-menu, & .woocommerce-product-gallery); and if it finds the current options[i] in the <body> DOM, then:

    (2) the inner loop, controlled by “.each(function()”, looks for every instance of that options[i] in body and adds the images within that sub-DOM instance to the links object “array”. In other words, it creates multiple lightboxes per page–and, in fact, NOT JUST a separate one for each options[i] image set (from the outer loop), BUT ALSO a separate lightbox for each instance of options[i] as well.

    But I want a single lightbox for all linked images on a page, i.e. a single image set that is sent to magnific. Specifically, for me, options[7]===’.post-entry’ is not only found in outer 1/1, 1/2, etc. layout sections, in which I may put images, but also in Color Sections, in which I will definitely put images, perhaps in inner 1/1, 1/2, etc. layout sections within the Color Sections. It’s the Color Section that ends up separating out ‘.post-entry’ images from each other, creating multiple image sets sent to magnific for separate lightboxes (notice the <div class=’post-entry post-entry-type-page post-entry-31′> line):

    <div class='avia-section av-lib3uyi7-57ce06e0452ac92eb7d4393a8384e180 main_color avia-section-default avia-no-border-styling  avia-builder-el-62  el_after_av_section  el_before_av_section  mainPageBodyThreeCols avia-bg-style-scroll container_wrap fullsize'  >
        <div class='container av-section-cont-open' >
            <div class='template-page content  av-content-full alpha units'>
                <div class='post-entry post-entry-type-page post-entry-31'>
                    <div class='entry-content-wrapper clearfix'>
                        <div  class='flex_column av-i3z0f-243165cc077a80e50bbee8f020d21535 av_one_third  avia-builder-el-63  el_before_av_one_third  avia-builder-el-first  first flex_column_div  '     >
                            <div  class='avia-image-container av-lib47uf4-9660e94fab46a96b36ab619c8b679a09 av-styling- avia-align-center  avia-builder-el-64  el_before_av_textblock  avia-builder-el-first  av-group-lightbox'   itemprop="image" itemscope="itemscope" itemtype="https://schema.org/ImageObject" >
                                <div class="avia-image-container-inner">
                                    <div class="avia-image-overlay-wrap">
                                        <a href="...dentures.jpg" class='avia_image' >
                                            <img decoding="async" class='wp-image-699 avia-img-lazy-loading-not-699 avia_image ' src="...dentures-300x264.jpg" alt='...'  height="264" width="300"  itemprop="thumbnailUrl" srcset="..." sizes="(max-width: 300px) 100vw, 300px" />
                                        </a>
                                    </div>
                                </div>
                            </div>...

    In other words, each .avia-section (Color Section) has its own class=’post-entry post-entry-type-page post-entry-31′, so the images under that DOM are collected as a separate image set for a lightbox.

    So I ended up just bypassing all of it, and replaced the code in avia-snippet-lightbox.js with my own child_avia-snippet-lightbox.js:

    return this.each(function()
    {
        //Find all linked images
        var myLinks = $(options.autolinkElements, this);
        
        //Note: ".not(options.exclude)" is left out of this "myLinks.not(options.exclude).addClass(..." on purpose to impose the policy: if you want to exclude an image from the all-images set in the lightbox, just don't make it a link. Linked images excluded from the lightbox means if the user clicks on that linked image, it will follow that link, which is to open it's full size image, but without the lightbox's closing mechanism. Then the only way for the user to go back to the page is to click the Back button--which is bad UX.
    
    	myLinks.addClass('lightbox-added').magnificPopup($.avia_utilities.av_popup);
    });

    And adding this to my child functions.php file:

    add_action('wp_enqueue_scripts', 'magnific_script_fix', 100);
    function magnific_script_fix()
    {
        wp_dequeue_script('avia-lightbox-activation');
        wp_enqueue_script('child_avia-lightbox-activation', get_stylesheet_directory_uri().'/child_avia-snippet-lightbox.js', array('jquery'));
    }

    Also, as you can see, I’ve left out “.not(options.exclude)” from myLinks.not(options.exclude).addClass(‘lightbox-added’).magnificPopup($.avia_utilities.av_popup) for the following reason: If I put it in, then, yes, the images with those exclusion classes will be excluded from the lightbox. But they are still linked images: so if a user clicks on one of them, it will follow that link, which is to open it’s full size image, but without the lightbox’s closing mechanism. So the only way for the user to go back to the page is to click the Back button–which is bad UX.

    FYI: I attempted to figure out a way to add each of those excluded images in its own individual one-image lightbox, but I just couldn’t even figure out how Enfold does the not(options.exclude), as a starting point (going step by step in the debugger to see how it’s doing it was a bewildering experience), so I just gave up. So I just gave myself the policy: if you want to exclude an image from the all-images set in the lightbox, just don’t make it a link. Lol. Yes, I could have left the .not(options.exclude) in there and just not used it per my policy, but I wanted to make sure the UX stays correct by preventing me (or anyone else maintaining the site) from having any effect to forgetting the policy and adding e.g. “noLightbox” to an image’s Custom CSS Class field, expecting it to be excluded from the lightbox, but still keeping the image’s link active. No: if I (or they) go into the code, they’ll see there is no .not(options.exclude) at all, and read the comment in the code, to see why their image is not getting excluded from the lightbox.

    So, anyway, that’s my solution to my particular problem. I appreciate your help, Mike. Unless you have some solution code for me to include those excluded images in their own individual one-image lightboxes (which would be helpful to just round up this solution, in case others want to use it), you may close this thread.

    Thanks very much,
    Gary

    • This reply was modified 2 years, 10 months ago by garysch37.

    Hey philipbrook,

    Thank you for the inquiry.

    Adding the following css code should adjust the position of the wishlist button below the bundled package.

    #top .bundle_form.bundle_sells_form #wl-wrapper {
        margin-top: 0;
    }
    
    #top .bundle_form.bundle_sells_form + .<a href="https://refer.wordpress.com/r/84/woocommerce/" target="_blank" rel="nofollow">woocommerce</a>-variation-add-to-cart {
        margin-top: -90px;
    }

    Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings in order to ensure that the changes take effect.

    Best regards,
    Ismael

    rup
    Participant

    Dear Enfold Support Team,

    I hope this message finds you well. I am encountering an issue with the fullscreen button in the HTML5 video player of the Enfold theme on my website. I have compared the configuration with another website using the same theme and version, and it appears that there is a discrepancy.

    Here are the details of the issue:

    1. The fullscreen button does not appear in the video player controls, despite having the necessary settings and attributes enabled.
    2. Upon inspecting the original avia.js file provided by Enfold, I noticed that there should be a class named av-html5-fullscreen-btn on the container element. However, in the frontend of my website, I do not see this class applied. On the compared website, I noticed the presence of some other classes as well.
    3.While investigating the issue, I have reviewed my website’s setup and configuration. I haven’t identified any reasons why another plugin should be causing this issue. Therefore, I believe the problem may be specific to the Enfold theme or its integration on my website.

    Given these observations, it appears that there might be a bug or specific configuration issue related to my website’s implementation of the Enfold theme.

    Could you kindly investigate this issue and provide guidance on how to resolve it? I would greatly appreciate any insights or suggestions you can offer to help me enable the fullscreen button in the Enfold theme’s HTML5 video player.

    For your reference, here are some key details:

    Website URL: See private message
    Enfold Theme Version: 5.6.2
    WordPress Version: Version 6.2.2

    Please let me know if you require any further information or if there are any specific steps I should take to assist in the resolution process. I look forward to your prompt response and assistance in resolving this issue.

    Thank you for your attention and support.

    Kind regards

    • This topic was modified 2 years, 10 months ago by rup.
    #1411054

    Hi,

    • Please go to Enfold theme options > Layout Builder, enable the Show Advanced Options toggle, and enable the Debug Mode for admins (https://i.imgur.com/3FvoNJV.png).
    • On an empty page, add a Social Buttons element to your page, configure it, and copy its shortcode from the debug field (https://i.imgur.com/QbNvXT2.png)
    • Go to Appearance > Widgets, add a Custom HTML widget to your widget area, and paste the shortcode into it.

    Best regards,
    Yigit

    #1410601
    retom
    Participant

    Hello
    I have created our company webpage with your valued support.

    Today when I went into WordPress and Enfold with the intention to add some content, WordPress stated that there is a newer version of the website “Es gibt eine automatische Speicherung dieses Beitrags, die aktueller ist als die unten stehende Version.”
    I accepted this and since then – also after undoing the revision version – the site does not display correctly.

    Problems/ items not correctly displayed:
    – header: used to be gradient from dark grey to transparent at the bottom (and background image to the top). Now there is a black bar on top
    – Background image: used to be full page width. Now it is only in the width of the content block.
    – Fullwidth buttons: used to be same height and with background reaching from top line to bottom line. Now the buttons are not of same heigth and background does not reach down to buttom line.

    I would very much appreciate your help, as I need to fix this urgently. And I don’t know where the problem.

    Best Regards,
    Reto

    #1410499

    Hi Mike thanks for continuing to help me with this…

    I followed your instructions and which made it better. That brings the overlay down to the bottom of the logo – so that’s an improvement though I’d like the overlay to take up the full background as it does in the Aweber page that is not linked to Enfold. Is that possible?

    Also – the mobile view of the page i has the overlay cutting off at just above the form button.

    #1410422
    webagent007
    Participant

    Hey guys,

    i love enfold. using it since 2015 and i am still impressed by every new version.

    My problem:
    i have a button with the class “.trigger1” and a section (that is hidden by default) named “#hide1”.
    So whenever i´m hovering an element with that class, the hidden section fades in.
    therefore i searched the forums and used this code in my child-theme´s function.php.
    it works well on the test server but not on the new server even if the WordPress Versions and the enfold versions are exactly the same.

    here it´s working fine: http://www.silkeetex.de

    
    /* hide/show sections */
    function add_custom_cs(){
    ?>
    <style>
    .trigger1,
    .trigger2,
    .trigger3,
    .trigger4,
    .trigger5,
    .trigger6,
    .trigger7 {
        cursor: pointer; /* Change cursor to hand */
    }
    </style>
    <script>
    jQuery(window).load(function(){
        jQuery("#hide1, #hide2, #hide3, #hide4, #hide5, #hide6, #hide7").hide();
        
        jQuery(".trigger1").hover(function() {
            if (jQuery("#hide1").is(":visible")) {
                jQuery("#hide1").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide1").show().addClass("active");
            }
        });
        
        jQuery(".trigger2").hover(function() {
            if (jQuery("#hide2").is(":visible")) {
                jQuery("#hide2").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide2").show().addClass("active");
            }
        });
        
        jQuery(".trigger3").hover(function() {
            if (jQuery("#hide3").is(":visible")) {
                jQuery("#hide3").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide3").show().addClass("active");
            }
        });
        
        jQuery(".trigger4").hover(function() {
            if (jQuery("#hide4").is(":visible")) {
                jQuery("#hide4").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide4").show().addClass("active");
            }
        });
    	
    	jQuery(".trigger5").hover(function() {
            if (jQuery("#hide5").is(":visible")) {
                jQuery("#hide5").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide5").show().addClass("active");
            }
        });
        
        jQuery(".trigger6").hover(function() {
            if (jQuery("#hide6").is(":visible")) {
                jQuery("#hide6").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide6").show().addClass("active");
            }
        });
        
        jQuery(".trigger7").hover(function() {
            if (jQuery("#hide7").is(":visible")) {
                jQuery("#hide7").hide().removeClass("active");
            } else {
                jQuery(".active").hide().removeClass("active");
                jQuery("#hide7").show().addClass("active");
            }
        });
    });
    </script>
    <?php
    }
    add_action('wp_footer', 'add_custom_cs');
    
    /* avoid jumping up to header */
    function add_custom_href_remove(){
    ?>
    <script>
    jQuery(window).load(function(){
    jQuery('.trigger1,.trigger2,.trigger3,.trigger4,.trigger5,.trigger6,.trigger7').removeAttr('href');
    });
    </script>
    <?php
    }
    add_action('wp_footer', 'add_custom_href_remove');

    Why is that? Can anyone please help?

    • This topic was modified 2 years, 10 months ago by webagent007. Reason: typos
    #1410236

    Hey rixi,
    Try going to Enfold Theme Options ▸ Advanced Styling then from the dropdown choose Menu Links in overlay/slide out and click the button Edit Element then you will see the options:
    Enfold_Support_2320.jpeg

    Best regards,
    Mike

    #1410154

    Hey Stilecatalini,
    Thanks for your patience and the link to your site, I see your sticky close button at the bottom of your page, but it links to the homepage “Barche” section, so this is more like a “back” button than a “close” button.
    Nonetheless to add this button to your three pages venticinque, venticinque-panoramica, ventuno-sport-fisherman and have it hide on scroll down and show on scroll up, add this code to the end of your child theme functions.php file in Appearance ▸ Editor:

    function custom_back_button() { ?>
      <script>
    (function($){
      var button = $('<div class="avia-button-wrap avia-button-right back-button"><a href="https://www.stilecatalini.it/#barche" class="avia-button avia-icon_select-yes-left-icon avia-size-large avia-position-center av-button-notext avia-color-light avia-font-color-white"><span class="avia_button_icon avia_button_icon_left" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title"></span><span class="avia_button_background avia-button avia-color-theme-color"></span></a></div>');
      if ($("body").hasClass("page-id-738") || $("body").hasClass("page-id-5837") || $("body").hasClass("page-id-5667") == true) {
      $(button).prependTo('#wrap_all');
      } else {}
    })(jQuery);
      
    (function() {
        var doc = document.documentElement;
        var w = window;
        var prevScroll = w.scrollY || doc.scrollTop;
        var curScroll;
        var direction = 0;
        var prevDirection = 0;
        var backButton = document.querySelector('.back-button');
        var checkScroll = function() {
            curScroll = w.scrollY || doc.scrollTop;
            if (curScroll > prevScroll) {
                direction = 2;
            } else if (curScroll < prevScroll) {
                direction = 1;
            }
            if (direction !== prevDirection) {
                toggleButton(direction, curScroll);
            }
            prevScroll = curScroll;
        };
        var toggleButton = function(direction, curScroll) {
            if (direction === 2) {
                backButton.style.opacity=0;
                prevDirection = direction;
            } else if (direction === 1) {
                backButton.style.opacity=1;
                prevDirection = direction;
            }
        };
        window.addEventListener('scroll', checkScroll);
    }
    )();
    </script>
      <?php
    }
    add_action('wp_footer', 'custom_back_button');

    and this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    .back-button {
        position: fixed;
        top: 1%;
        right: 1%;
        z-index: 999;
        background-color: transparent;
    }

    Best regards,
    Mike

    #1410151

    Topic: Popup

    in forum Enfold
    Luisgasser
    Participant

    Hi, i use this solution for a popup window from another post:

    Hey axelfx07!

    Thank you for using Enfold.

    The Enfold uses MagnificPopup as default lightbox plugin. You can add this on functions.php:

    function popup_inline() { ?>
    <script type=”text/javascript”>
    jQuery(window).load(function(){
    jQuery(‘.open-popup-link’).magnificPopup({
    type:’inline’,
    midClick: true // Allow opening popup on middle mouse click. Always set it to true if you don’t provide alternative source in href.
    });
    });
    </script>
    <?php }

    add_action(‘wp_head’, ‘popup_inline’);
    Then use this on a text block:

    <div id=”test-popup” class=”white-popup mfp-hide”>
    <p>PLACE CONTENT HERE</p>
    </div>

    Show inline popup
    Add this on Quick CSS or custom.css:

    .white-popup {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 500px;
    margin: 20px auto;
    }
    Remove browser cache then reload the page a few times.

    Cheers!
    Ismael

    It works great, but on my mobile it scrolls automatically to the top on the page and the content of the popup doesn’t shown.

    Script is on “360° Tour” button on the bottom of the sidebar. Link ist in private content.

    May anybody have a solution to position it on the top of the mobile.

    Thank you for helping!

    #1410075
    biggsuccess
    Participant

    I closed an other topic on this, this but I’ve just noticed a couple other CSS issues I’m noticing on another landing page I’ve created using Aweber/ Enfold.

    The links are below. The font is smaller when linked to enfold and the darkened overlay cuts off at the opt-in button. Do you have some suggestions for these two issues?

    Thank you!

    • This topic was modified 2 years, 10 months ago by biggsuccess.
    #1409861

    In reply to: How to post a problem

    Hey Roman,

    You can do that by clicking this link , or this button on the support forum: https://imgur.com/a/AnoSPNb

    Best regards,
    Rikard

    #1409620

    Hi,
    If you add customizations to the parent theme function it will be lost on updates, but with a child theme they will not be lost.
    To add the Microsoft Team logo, I assume that this is not available as a icon so you can add it like we do for TikTok, try following these steps and adjust for your logo.
    If you are not using a child theme I recommend the WPcode plugin this plugin supports PHP code snippets, JavaScript code snippets, & CSS code snippets and allows you to export and import your custom code snippets to other sites that you may have or as a backup.

    Best regards,
    Mike

    #1409618
    Woutski
    Participant

    Hi,
    i have a selfhosted mp4 which works well but the mute button does not appear on phones.
    Cannot find a solution in Enfold 5.4.1

    Thanks, Woutski

    #1409392

    on that pininfarina page? which button should i press? Or is there an enfold page to see in private content?
    see buttons on my color-section: https://basis.webers-testseite.de/home4/

    #1409366

    Greetings,

    I am using polylang for multi-language support and need Loco translate for localisation.

    About “Sync”, I meant on the guide page I linked, in the Loco Translate section where you mention:

    It is important to sync files before updating to make sure all available strings are ready for translation. To sync files in Loco Translate, please go to Loco Translate -> Themes -> Enfold -> Overview tab -> Edit Template tab, click Sync button and Save. Then go to Loco Translate -> Themes -> Enfold -> Overview tab, choose your language, click Sync button and Save.

    Every time I reach this Sync step, all strings from translations get removed, so I think there is a mismatch with the source files or something similar causing the issue.

    #1409348

    Hi,

    Thank you for the update.

    To align the second widget to the right, just remove this css code:

    #footer .flex_column:nth-child(2) #nav_menu-2 {
        width: 100%;
        float: none;
    }

    Then replace it with:

    .flex_column:nth-child(2) #nav_menu-2 {
        float: right;
    }
    

    And to center align the contact form button, please add this:

    #top .wpcf7-spinner {
        position: absolute;
        bottom: 25px;
        left: 15px;
    }
    

    Again, please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings in order to ensure that the changes take effect.

    Best regards,
    Ismael

    #1408746

    Hi GB,

    Go to Appearance > Menus > click the dropdown (to select a menu to edit), edit the menu thas has (Enfold Child Footer Menu (no dropdowns)) in it, then click the Select button.
    Uncheck Enfold Child Footer Menu and Save.
    Hope this helps.

    Best regards,
    Nikko

    #1408352

    In reply to: Support

    Hey Evan Posocco,

    Thanks for contacting us!
    And yes, you can renew your support access, by logging in to your account on ThemeForest and navigate to Enfold’s page at https://themeforest.net/item/enfold-responsive-multipurpose-theme/4519990. Once there, simply click on the “Renew support” button located on the right-hand side. Following that, you can proceed to https://kriesi.at/support/forum/enfold#new-post to re-validate your purchase code.

    Best regards,
    Nikko

    #1408243

    Topic: Sticky flyout button

    in forum Enfold
    M-Graphics24
    Participant

    Hi Team

    Please could somebody assist me with setting up a sticky flyout on the right-hand side of all my pages in enfold?. I don’t know if I have named the element correctly. You can go to http://www.defendoor.co.za and see what I am referring to – it is the “GET A QUOTE” sticky flyout on the right in green.

    Thank you

    #1408233
    andreas_anselm
    Participant

    Hi Enfold Team,
    I’ve created a floating button on the front page, but the link does’nt work.
    I’ve no Idea, hope you got one.
    find enclosed the login data
    thx in advance
    warm regards Andrew

    #1408066

    Hey LiorMaymon,
    Thank you for your patience to add a new social profile please see this subject in our documentation: How to add Custom Social Icons to Enfold options.
    Here is an example of adding the TikTok social icon with some screenshots that may help explain, if you have any issues please include an admin login to your site in the Private Content area so we can be of more assistance.
    For your portfolio to have a gap and have a title overlay:
    Enfold_Support_2119.jpeg
    try using the masonry element to display your portfolio items and set the title as an overlay:
    Enfold_Support_2121.jpeg
    and choose a large gap:
    Enfold_Support_2123.jpeg

    Best regards,
    Mike

    #1407958

    Hi Mike.
    I hope this email finds you well. I am writing to seek assistance regarding a couple of issues I am facing with the Enfold theme. As I mentioned previously, I would like to configure the layout in a way that the city is displayed first, followed by the local school locations. Since we are organizing a camp, it is important for us to minimize confusion by avoiding an overwhelming number of options for participants from different cities. Could you kindly advise me on how to set up this particular arrangement?

    Moreover, after clicking the “Add to Cart” button, the page does not automatically redirect to the checkout page. Instead, I am required to manually move my cursor to the shopping cart icon in order to proceed with the checkout process. I would appreciate any suggestions on how to improve this functionality for a smoother user experience.

    Lastly, during the checkout process, I noticed that only PayPal and Tappay options are available. When attempting to select “Debit Card or Credit Card,” it does not seem to work. Could you please assist me in resolving this issue so that customers can complete their purchases using debit or credit cards?

    Thank you in advance for your attention to these matters. I look forward to your prompt response and guidance. Please let me know if any further information is required from my end.
    Thanks!

    garysch37
    Participant

    Dear Support Team:

    As part of my responsive images work, I am trying to replace a banner-like image on my home page, that spans the entire browser window width, with a smaller image on smaller windows/screens. I have an Image inside a Color Section at the top of the home page (under the header) that I inserted from my Media Library (that includes the alt & title text). Initially I tried with CSS (couldn’t get it to include alt & title text on the images), and now with Javascript (can’t get it to work at all).

    I’ve tried specifically in (i) Firefox in Windows 7, (ii) Safari, Firefox, & Chrome on a Mac desktop, and (iii) Safari on an iPhone: the smaller banner does not load (and the larger banner displays only because it’s in the Color Section).

    So, as I wrote, initially I tried with CSS:

    @media only screen and (min-width:965px) {
        .homeBannerIMG {
            content: url(https://...banner1.jpg);
        }
        .homeBannerIMG::before { /* For Firefox issues */
            content: url(https://...banner1.jpg);
        }
    }
    
    @media only screen and (max-width:964px) {
        .homeBannerIMG {
            content: url(https://...banner2.jpg); /* Concatenating '/ "test alt"' to the end doesn't work */
        }
        .homeBannerIMG::before{
            content: url(https://...banner2.jpg);
        }
            /* Note: https://developer.mozilla.org/en-US/docs/Web/CSS/content says this works:
                content: url("http://www.example.com/test.png") / "This is the alt text";
            BUT IT DOESN'T FOR ME!. Plus I want the image Title as well for the hover tooltip. */

    But I wasn’t able to maintain my alt & title text on the image. So I switched to Javascript (in my child functions.php file), first trying:

    function displayHomeBanner() {
        if (window.matchMedia("(min-width: 965px)").matches) {
            document.getElementById("homeBannerIMG").src="https://...banner1.jpg";
        } else {
            document.getElementById("homeBannerIMG").src="https://...banner2.jpg";
        }
    }

    But that didn’t work: when I made my browser window below 965px wide, banner2 was not swapped in; it stayed as banner1. Then I tried:

    document.getElementById("homeBannerIMG").getElementsByTagName('img')[0].src="https://...banner2.jpg";

    But that didn’t work. Then I tried:

    document.getElementsByClassName("homeBannerIMG")[0].src="https://...banner2.jpg";

    Still no luck. I just can’t get banner2 to display.

    Note that my full CURRENT code in my child function.php file is:

    function windowSizeActions() {
        ?>
        <script>
            window.onresize = actOnWindowSize;
            window.onload = actOnWindowSize;
            
            function actOnWindowSize() {
                
                function displayWindowSize() {
                    myWidth = window.innerWidth;
                    myHeight = window.innerHeight;
                    document.getElementById("dimensions").innerHTML = " >>> " + myWidth + " x " + myHeight;
                }
            
                function displayHomeBanner() {
                    if (window.matchMedia("(min-width: 965px)").matches) {
                        /*document.getElementById("homeBannerIMG").src="https://...banner1.jpg";*/
                        document.getElementsByClassName("homeBannerIMG")[0].src="https://...banner1.jpg";
                    } else {
                        /*document.getElementById("homeBannerIMG").src="https://...banner2.jpg";*/
                        /*document.getElementById("homeBannerIMG").getElementsByTagName('img')[0].src="https://...banner2.jpg";*/ /* Based on https://kriesi.at/support/topic/using-javascript-to-set-image-src-using-developer-id/: document.getElementById(‘work_image’).getElementsByTagName(‘img’)[0].src = work_image; */
                        document.getElementsByClassName("homeBannerIMG")[0].src="https://...banner2.jpg";
                    }
                }
                displayWindowSize();
                displayHomeBanner();
            }
            
        </script>
        <?php
    }
    add_action( 'wp_enqueue_scripts', 'windowSizeActions' );

    First of all, as you can see, I’ve commented out my earlier attempts at loading the src, with just my last attempt with getElementsByClassName live.

    Secondly, I have my displayHomeBanner function embedded in the function actOnWindowSize, and that in an overall function windowSizeActions, because I need debug code to display the window size, done by my displayWindowSize function (and another function elsewhere to set up the HTML). That function works: my window size is displayed at the top of my window constantly, and changes as I change the browser window size. So this also ensures that things are working, except displayHomeBanner is not working.

    Also note that I have tried my code outside of WordPress/Enfold/Aria, using any w3schools.com‘s page’s Try it Yourself button:

    <!DOCTYPE html>
    <html>
    <body>
    
    <div>
      <img id="homeBannerIMG" src="https://...banner1.jpg" alt="test alt" title="test title">
    </div>
    
    <script>
      window.onresize = actOnWindowSize;
      window.onload = actOnWindowSize;
            
      function actOnWindowSize() {
                
        function displayWindowSize() { /* This of course won't work here, but it's irrevelent. */
          myWidth = window.innerWidth;
          myHeight = window.innerHeight;
          document.getElementById("dimensions").innerHTML = " >>> " + myWidth + " x " + myHeight;
        }
            
        function displayHomeBanner() {
          if (window.matchMedia("(min-width: 965px)").matches) {
            document.getElementById("homeBannerIMG").src="https://...banner1.jpg";
          } else {
            document.getElementById("homeBannerIMG").src="https://...banner2.jpg";
          }
        }
                
        displayHomeBanner();
      }
    </script>
    
    </body>
    </html>

    and

    <!DOCTYPE html>
    <html>
    <body>
    
    <div>
      <img class="homeBannerIMG" src="https://...banner1.jpg" alt="test alt" title="test title">
    </div>
    
    <script>
      window.onresize = actOnWindowSize;
      window.onload = actOnWindowSize;
            
      function actOnWindowSize() {
                
        function displayWindowSize() { /* This of course won't work here, but it's irrevelent. */
          myWidth = window.innerWidth;
          myHeight = window.innerHeight;
          document.getElementById("dimensions").innerHTML = " >>> " + myWidth + " x " + myHeight;
        }
            
        function displayHomeBanner() {
          if (window.matchMedia("(min-width: 965px)").matches) {
            document.getElementsByClassName("homeBannerIMG")[0].src="https://...banner1.jpg";
          } else {
            document.getElementsByClassName("homeBannerIMG")[0].src="https://...banner2.jpg";
          }
        }
                
        displayHomeBanner();
      }
            
    </script>
    
    </body>
    </html>

    In both, my displayHomeBanner function works: my banner2 displays on smaller window sizes (and the title tooltip works)!

    Can you help me get it to work in WordPress please.

    Thank you,
    Gary

    • This topic was modified 2 years, 11 months ago by garysch37.
    • This topic was modified 2 years, 11 months ago by garysch37.
    #1407689

    Hi Nomad,

    I apologize, you’re right, there’s no padding in Text Block, I was actually referring to the button with regards to padding, as for Text Block, it is possible via CSS.
    Edit the Text Block, go to Advanced (tab) > Developer Settings > Custom CSS Class and put myblock (you can change myblock to any name)
    Then in Enfold > General Styling > Quick CSS:

    #top .myblock {
      padding: 8px 20px; /* 8px padding top and bottom, 10px padding left and right */
    }

    There’s a lot of things that can be put into it, here’s a list: https://dofactory.com/css/properties
    Hope it helps.

    Best regards,
    Nikko

    #1407679
    stepheng
    Participant

    5-16
    Hi Enfold,
    I have buttons but I would also like the opposing image to open the same lightbox blog page.
    This works for Button and Image links but not for Column links.
    /?iframe=true
    The images on this page are background images. If I place them in this layout as a regular images I can make links but they do not resize correctly. (Covering the full space available).
    Please advise.
    Thanks,
    Stephen

    • This topic was modified 2 years, 11 months ago by stepheng.
    #1407504

    Hi Nomad,

    Edit the Text Block Button, go to Styling (tab) > Spacing, and you should be able to see padding options there.
    Line height is not set individually but it can be set in Enfold Theme Options > Advanced Styling.
    As for the button style, edit the button and go to Advanced (tab) > Developer Settings > Custom CSS Class and add special-button then in Enfold Theme Options > General Styling > Quick CSS, add this CSS code:

    #top #wrap_all .special-button .avia-button {
        background: #164066;
        background-image: linear-gradient(270deg,#0d263c 0,#1f5a90 51%,#164066);
        background-size: 200% auto;
        border: none;
        background-position: 100%;
        transition: background-position .3s cubic-bezier(.4,0,.2,1);
        color: #fff;
        text-shadow: 0 0 20px #081927;
    }
    
    #top #wrap_all .special-button .avia-button:hover {
        background-position: 0;
    }

    Just adjust the colors as you see fit.

    Best regards,
    Nikko

    • This reply was modified 2 years, 11 months ago by Nikko.
Viewing 30 results - 691 through 720 (of 11,220 total)