Hey Lene,

Please try the following in Quick CSS under Enfold->General Styling:

@media only screen and (max-width: 479px) {
.responsive #top #wrap_all #header .social_bookmarks {
    display: block;
}
}

Best regards,
Rikard

Hey MikeTandySwag,
Thanks for the mockup, I recommend using the Masonry Element with the Display Title and Excerpt and Display as centered overlay (overlays the image) selected:

then under styling choose a Large Gap and Perfect Grid:

Then under the Advanced tab ▸ Developer Settigs add the custom class custom-masonry-with-button, note that you do not add the class dot:

For my example I choose to use two columns and only show four posts.
Then add this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

.custom-masonry-with-button .av-masonry-date {
	display: none;
}
#top .custom-masonry-with-button.av-caption-style-overlay .av-masonry-item-with-image .av-inner-masonry-content-pos {
    vertical-align: bottom;
}

Then add this code to the end of your child theme functions.php file in Appearance ▸ Editor:

add_filter('avf_masonry_loop_prepare','avia_change_default_link', 10, 2);
function avia_change_default_link($loop, $entries)
{
	foreach($entries->posts as $key => $entry)
    {
        if($entry->post_type == "post")
        {
            $more 	 		 =  "<br /><span class='custom-masonry-more-button avia-button avia-size-x-large avia-position-center avia-color-light'>".__('Read more','avia_framework')."</span>";
			$loop['content'] =   avia_backend_truncate($entry->post_content, apply_filters( 'avf_masonry_excerpt_length' , 0) , apply_filters( 'avf_masonry_excerpt_delimiter' , ""), "", true, '') . $more;
        }
    }

    return $loop;
}

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, for this code you would choose the PHP snippet:

This is the expected results:

Please give this a try.

Best regards,
Mike

Hey katewoods94,
Thanks for your question, the icons used in the Enfold theme, such as in the icon element, are in a icon-font format and not in a image format that most icons are when you download them.
You can download the icon-fonts from Fontello.com and add them in the theme setting Enfold Theme Options ▸ Import/Export ▸ Iconfont Manager, or you can use icons found elsewhere and convert them into the SVG file type and upload them into Fontello.com and create your own custom icon-fonts. Note that sometimes Fontello can be picky, so here is a way to fix them.
Please note that icon-fonts can not have colors, so if you want to use color icons you should upload the images to your media library and then use css to show the images.
One clever way to do this is to use a built-in icon-font that you would probably never use and then use some css to replace it with your icon image, see this thread.

Best regards,
Mike

Hey biggsuccess,
I added this CSS to the top of your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) and (orientation: landscape) { 
.responsive #top #wrap_all #main {
	padding-top: 119px !important;
}
}

and tested on my Android device, please clear your browser cache and check.
Please note that testing with iPhones can be hard to clear the cache, often you need to also clear the history to fully purge the cache, following these steps for Safari and note Step 4 where you will Clear the History.

Best regards,
Mike

Hey mirr,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .av_header_transparency.av_alternate_logo_active .logo {
    height: 90px;
    width: 190px;
    padding-top: 0;
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,

Great, I’m glad that we could help you out. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hi,

Thank you for the update.

We edited the code a bit. Please remove the previous code and replace it with the following.

#top #wrap_all #av-burger-menu-ul>li {
    opacity: 100;
    position: relative;
    top: 0;
    transition: none;
    transform: none;
    left: 0;
    right: auto;
    text-align: left;
    border-bottom: 0.1em solid #fff!important;
    text-align: left;
    font-weight: 800;
    font-size: 28px;
    text-transform: uppercase;
}

#top #wrap_all #av-burger-menu-ul>li:first-child {
    border: none !important;
}

Best regards,
Ismael

Hi,

Thank you for the update.

Adding this css code should hide the burger menu icon inside the main header container.

@media only screen and (max-width: 1024px) {
  /* Add your Mobile Styles here */
  .html_header_top .av_bottom_nav_header .av-logo-container .main_menu li.av-burger-menu-main.menu-item-avia-special {
    display: none;
  }
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings afterward.

Best regards,
Ismael

Hey Alexandre,

If you can’t get access to the account which was used to purchase the license, then I would recommend that you purchase a new license. Otherwise you will have this problem every time you need to update or access the theme files.

Once you have access to the theme files, then the update to 5.6.9 has to be done manually from the version you are running, please refer to my replies in this thread: https://kriesi.at/support/topic/enfold-4-5-theme-update-update-failed-download-failed-a-valid-url-was-not-pro/#post-1021541
You can either update manually via FTP: https://kriesi.at/documentation/enfold/how-to-install-enfold-theme/#theme-update, or upload the new theme files via Appearance->Themes->Add New, and select to overwrite the old theme files after the upload has finished.

If that doesn’t work then please try to delete the whole theme folder, then replace it with the new version. Make sure that you have backups of the site before starting updating.
Also please read this after you have updated: https://kriesi.at/documentation/enfold/theme-registration/

Best regards,
Rikard

Hi,

Great, I’m glad that we could help you out. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hi,

Thank you for the update.

Did you set the Layout > Height > Content height settings of the Tab Section element to the first option (Same height for all tabs)? This will retrieve the height of the tallest section and apply it to other sections. You should also check each tab’s Styling > Alignment > Vertical align settings and adjust them from Middle to Top.

Best regards,
Ismael

Hi,

Thank you for the screenshot.

The heading seems to be resizing correctly on our end, but if you still want to adjust it, you can try this css code.

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

  /* Add your Mobile Styles here */
  #top #wrap_all .av-special-heading.av-1kii6-20aefa4b8a1e86b824c2b08956737de9 .av-special-heading-tag, #top #wrap_all .av-special-heading.av-3yvx2-b3a74335a955a8c783977b3748088567 .av-special-heading-tag, #top #wrap_all .av-special-heading.av-12jlsm-3c4c1638e4edbfc505398e6c922fa44b .av-special-heading-tag, #top #wrap_all .av-special-heading.av-118a8u-b260f37eef566a9c2d56de7e85194bae .av-special-heading-tag {
    font-size: 1.2em;
  }
}

Best regards,
Ismael

Hey Sebastian,

Thank you for the inquiry.

You can add this css code to disable the animation of the burger menu items.

#top #wrap_all #av-burger-menu-ul>li {
    opacity: 100;
    position: relative;
    top: 0;
    transition: none;
    transform: none;
}

Best regards,
Ismael

Hey Munford,

Thank you for the inquiry.

The left and right columns are already set to be 50%, but the row doesn’t expand to full width when there’s little text in the right column. To fix this, please try adding the following css code.

#top .isotope-item.special_av_fullwidth .inner-entry {
    text-align: left;
    display: table;
    table-layout: fixed;
    width: 100%;
}

Best regards,
Ismael