Hi,
Sorry for the late reply, I see that there is some confusion here, “entypo-fontello” is not a font for text, it is a font file that contains svg icons, for your content: "\e894"; so “entypo-fontello” can not be applied to text and work.
In your screenshot the font for the text is “open sans” and the font to create the icon is “entypo-fontello”

The “entypo-fontello” only applys to the pseudo-element “:before” which displays the icon.
So to use the css that you posted above you need to include the pseudo-element “:before” like this:

#top #header .main_menu ul:first-child > li > a:before {
font-family: entypo-fontello;
content: "\e894";
font-size: 16px;
padding-right: 5px;
}

I removed the text-transform: uppercase; because it does nothing for “entypo-fontello”.
I hope this helps.

Best regards,
Mike

Hi,
Glad to hear, we will leave this open to hear back from you.

Best regards,
Mike

Hi,
Glad to hear, we will leave this open to hear back from you.

Best regards,
Mike

Hi,
I just tested and it’s working fine, but I don’t have 80k in images. This plugin uses a WP core function that doesn’t change so it doesn’t get updated often. The nice thing about the plugin was it listed all of the sizes in use. So for WP reserved sizes it is recommend to set them to zero to stop them from being created and for theme and plugin sizes you can unset them. Here is a good article about it.
This user reported a function for removing all of the image sizes perhaps give it a try.

Best regards,
Mike

Hey dreamreader,
Is this for one page of for all of the?
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

#wrap_all #header_main, #wrap_all #header_meta {
    background-color: red !important; 
}

Feel free to adjust to suit.
After applying the css, Please clear your browser cache and check.

Best regards,
Mike

Hey Shane,
Thanks for the login, when I looked at your header it was “sticky” that is that it stays visible after scroll, so after looking at your mockup and our documentation demo I assumed that you didn’t want this so I removed it so the header scrolls up now.
I also made some other tweaks, please clear your browser cache and check.

Best regards,
Mike

Hi,
Ok, thanks for using Enfold.

Best regards,
Mike

Hi,
Thanks for the login, I can see your bold or “strong” tags in your newest post in Chrome, so I believe you are experiencing a caching issue, for me, the easiest way to clear the Chrome cache is to hit “F-12” (on Windows) to open the developer console and then right-click on the reload button next to the address bar and choose the “Empty Cache and Hard Reload” option.
I tried the create a test post to see your text color issue, I used the Advanced Layout Builder and added a “text block” element, but when I clicked preview the color was black, I also tried the default wordpress editor, but that was also black.
But the text in the “element preview” panel did look a little gray, but this part of the element doesn’t show the colors 100% correctly, it is only meant to give you an idea. Is this what you are talking about, or do you mean after it is published?
Can you create a test post and publish it so we can see the gray text? This will let us see what css is being applied and fix it for you. Sometimes depending on the base demo you used, the “em” and “blockquotes” might be a gray color but we can correct this with the Enfold Theme Options > Advanced Styling options.

Best regards,
Mike

Hi,
Well, I tested the plugins but it doesn’t help for this, that is they make it sticky but don’t move the sidebar to the top. But if you ever need a sticky element I recommend Sticky Menu (or Anything!) on Scroll, it works the best.
So I wrote this script to make a sidebar sticky and fixed it to the top of the page over color sections, but I recommend using columns inside of the color section so content is not stuck behind the sidebar unless you want an image to stretch behind the sidebar. You should be able to adjust some of the css inside of the script to suit your needs. Try adding this code to a “code block” element on every page you want this to work, this might be better than adding it to your functions.php and have it accidentally affect some other pages.

<script>
(function($){
  $(document).ready(function(){
  $('.inner_sidebar').css({ 
  	"top":"130px",
  	"position":"fixed",
    "background-color":"#f8f8f8",
    "right":"5px",
    "padding-left":"20px",
    "padding-top":"20px",
    "z-index":"509"});
  });
  $('.units.alpha').css({ 
  	"border-color":"transparent"});
  $('#top #wrap_all #footer').css({ 
  	"z-index":"0"});
})(jQuery);
</script>
<style>
#top #wrap_all #footer {
z-index: 0 !important;}
</style>

Best regards,
Mike

Hi,
Sorry for the late reply, I was able to apply the color overlay to the grid row that had a background image, but I couldn’t also add the special heading or a text block to the grid row as it though it off, so I’s not very useful. You can give it a try by adding the custom class “grid-hover” to a grid row cell and try this css:

.grid-hover:hover:before {
  content:"";
  display: block;
  height: 100% !important;
  visibility: visible !important; 
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(235,111,49,0.9)!important; 
}
.grid-hover {
  padding: 0px !important;	
}

I did find in our documentation that you can get closer to this effect with a title caption in the portfolio grid

this is the css I tested:

/* Portfolio overlay with title */
/* Disable default animation */

#top .grid-entry a:hover .image-overlay .image-overlay-inside {
animation: none;
}

/* Overlay color */

#top .grid-entry .image-overlay {
background: rgba(235,111,49,0.9)!important;
}

/* Remove hover icon */

#top .grid-entry .image-overlay .image-overlay-inside:before {
display: none !important;
}

/* Remove default title below */

.grid-content .avia-arrow,
#top .grid-entry .grid-content {
display: none;
}

/* Display title on hover*/

.grid-entry a:hover:before {
content: attr(title);
position: absolute;
width: 100%;
z-index: 1000;
text-align: center;
opacity: 1;
font-size: 18px;
color: #ffffff !important;
top: 50%;
transform: translateX(-50%);
animation: avia-fadein 0.75s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275) !important;
}

Hope this is helpful.

Best regards,
Mike

Hey Munford,
Glad to hear you have been able to sort this out.

Best regards,
Mike

Hi,
Thank you for the link, I found “not an option” as bold, here is what it looks like for me:

was there also other ones? Does it not show only in preview before it is published?
You also said that the text is white by default? What is the color set at Enfold Theme Options > General Styling > Main Content > Main Content font color

also check Enfold Theme Options > Advanced Styling > p in case the color was set there:

If this doesn’t help please include an admin login so we can investigate further.

Best regards,
Mike

Hi,
Glad to hear :) If you have tried adding your buttons to other products and the buttons continue to work properly, then perhaps we can close this thread?

Best regards,
Mike

Hey jelle,
Sorry for the late reply, we can’t see your settings without logging in but when you edit your contact element you can look under “backend” > “Your email address” to enter the aaddresses you want the email to go to:

you can enter one or more Email addresses (separated by comma) where mails should be delivered to.
Unfortunately, we don’t have a way to create headings in the email for the responses you receive.
You may find a plugin such as the “Contact Form 7” offers more options like this for you.

Best regards,
Mike

Hey flordelizamejia,
Thank you for the links, you could open a “easy slider” in a “popup” lightbox by adding the easy slider shortcode into the popup light box.

First I used the “popup lightbox tutorial” but in this case I modified it a little so I could publish all of the code needed into a “code block” element, this makes it only work on page with the “code block”.

<script type="text/javascript">
jQuery(window).load(function(){
  jQuery('.open-popup-link').magnificPopup({
    type:'inline',
    midClick: true
  });
});
</script>
<!--/*triger*/-->
<a href="#test-popup" class="open-popup-link">Click this button to open a lightbox</a>
<!--/*popup box*/-->
<div id="test-popup" class="white-popup mfp-hide">
YOUR CODE GOES HERE
</div>
<style>
/*css*/
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width: auto;
  max-width: 500px;
  margin: 20px auto;
}
</style>

then in the code above where you see YOUR CODE GOES HERE I added the “easy slider” shortcode created with the “shortcode wand” from a “Classic Editor” post:

You could add other element shortcodes the same way if you wish, such as a “call to adtion” button

you can also edit the css in the code above to change the size of the popup or make the background transparent.

Best regards,
Mike