Hey!
Please add following code to Quick CSS as well and adjust as needed
div#header_main { border-top: none!important; }
#header_meta { box-shadow: none; }
.phone-info { font-size: 16px; }
#top .av-main-nav > li > a { font-weight: normal; }
.av-main-nav > li > a { padding: 0 40px; }
Cheers!
Yigit
Hi
I can’t get the phone number in the header to change size. I have entered the following into the Phone number box within Header:
<div id=”myphone”><b>Call us now on 0330 330 77 77</b></div>
and put the following within Quick CSS:
#myphone {
font-size: 40px;
padding-bottom: 10px;
}
.social_header .phone-info { font-size: 40px; }
But nothing happens. Please help
Hi – I can still a faint grey bar immediately below the Top Menu Bar … also, if I go to edit the small bar above the main menu, I only have options to change the font style, background colour and border colour (which is set to white) and not to increase the font size?
Everything else worked perfectly thank you. Last couple of queries – the main menu font seems to be bold? Can I remove that? And is it possible to add more spacing between each menu link in the main menu?
Thanks very much – your Theme is absolutely fantastic and so flexible – I’ve already bought several copies and will continue to buy more!
Hey gtj007!
Thank you for choosing Enfold and welcome to our support forum! :)
1- Please go to Appearance > Menus and change Home as needed
2- Please edit your page and add Color Section element to your page with a custom ID ( http://kriesi.at/documentation/enfold/wp-content/uploads/sites/2/2013/12/color-section-ID.png ) and add your image inside your Color section. Then add following code to Quick CSS in Enfold theme options under General Styling tab
#your-custom-id .container { width: 100%; }
3- Please add following code to Quick CSS as well
@media only screen and (max-width: 480px) {
.av-image-caption-overlay-center {
font-size: 16px!important;
}}
and adjust as needed
4-
span.post-meta-infos {
display: none!important;
}
5- Please go to Enfold theme options > Advanced Styling and edit “Main Menu links”
Regards,
Yigit
Hey!
Please add following code to Quick CSS in Enfold theme options under General Stlying tab and change image url
.blog-meta span.iconfont {
background-image: url(https://kriesi.at/wp-content/themes/kriesi/images/logo.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
}
.blog-meta span.iconfont:before { display: none; }
Regards,
Yigit
Hey!
Try to use the following:
.avia_textblock p {
font-size: 16px !important;
}
The textblocks on the homepage have in the tag <p style=”font-size: 12px;”>. This might break the code above, so if it does not work try to remove the style attribute.
Best regards,
Günter
Hey!
Try increasing the font-size value, for example 62px:
.avia_textblock h2 {
font-size: 62px !important;
}
Result:

Best regards,
Josue
Hi Guys!
2 Questions regarding size of text an button on a slideshow:
1) If found in your forum this css.style lines to change the text size on a slideshow.
div .slideshow_caption h2 { font-size: 36px; }
div.avia-caption-content { font-size: 28px; }
#top .avia-slideshow-button { font-size: 16px; }
Is there any possibility to change the textsizes seperatley for fullscreen and fullwith slider?
As I have on my homepage a fullscreen slider (which needs a bigger textsize) and on my product pages I use “only” a fullwith slider (which needs smaller text). So I want to set the text size for both sliders seperatley. How can I do that?
2) How can I decrease the padding between the text and the button on a slideshow?
Thx for your reply
Cheers
Herbert
I am trying to simply make the menu bar span horizontally across the entire page. For some reason, there is always white space to the left of the menu bar. I would appreciate any help. Thanks!
If it’s helpful: Here are the contents of my custom.css file:
/*Elimate Menu Separator*/
nav.main_menu ul:first-child > li > a{
border: none !important;
}
/*FONT SIZE of Top Menu */
nav.main_menu ul:first-child > li > a{
font-size: 16px !important;
}
/* MENU BAR SPAN ENTIRE PAGE */
#header_main_alternate .container, #header_main_alternate #avia-menu{
width: 100%;
/* SPACE 7 menu ITEMS UNIFORMLY */
}
#header_main_alternate #avia-menu > li{
width: 13.2%; /*(100/7 = 14.29) */
}
/*—- Top Menu Background Color —- */
.header_color nav.main_menu ul li {
background-color: #1B4799 !important;
}
Hi!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
div .widget_nav_menu:before {
content: 'my title';
font-size: 20px;
color: black; }
ul.nested_nav {
border-bottom: 1px solid #e2e2e2;
}
Regards,
Yigit
Hi connect4consulting!
You have following code in Quick CSS
.responsive_large .container .twelve.units {
width: 1210px;
padding-top: 30px;
}
please change it to
@media only screen and (min-width: 1340px) {
.responsive_large .container .twelve.units {
width: 1210px;
padding-top: 30px;
}}
and then add following code to Quick CSS
@media only screen and (max-width: 480px) {
div#section-1 h1 { font-size: 20px!important; }}
Regards,
Yigit
Hey afarahani!
1) You can use this code to remove the default theme flags completely – insert it into the functions.php file:
add_action('after_setup_theme','avia_remove_main_menu_flags');
function avia_remove_main_menu_flags(){
remove_filter( 'wp_nav_menu_items', 'avia_append_lang_flags', 20, 2 );
remove_filter( 'avf_fallback_menu_items', 'avia_append_lang_flags', 20, 2 );
remove_action( 'avia_meta_header', 'avia_wpml_language_switch', 10);
}
Then go to WPML > Languages and tick the “Display the language switcher in the WP Menu” option. You can also configure the language switcher type (dropdown, list, etc.) on this option page.
2) Try to insert this code into the quick css field to move the mail address to the next line:
@media only screen and (max-width: 767px){
.responsive .phone-info{
display: block;
margin-top: 29px;
}
}
3) Use this css code and adjust the font-size value:
.phone-info span {
font-size: 20px;
}
Regards,
Peter
Hello,
I am using WPML to translate http://www.franchiseelites.com into other languages. I have some problem with the language switcher:
1) I want a drop down menu for the language switcher. There is an option for drop down menu in WPML contols but it doesn’t work or at least I don’t undrestand why?!
2) In mobile version everything in the top line is cramped into one another. How can I arrange that in a way that looks fine in mobile. Specially with more languages this will have a very bad look.
3) How can I increase the font size of the email and phone number above the header?
Thanks
Amir
Hey youyou78!
Please add following code to Quick CSS in Enfold theme options under General Styling tab and adjust as needed
span.avia_button_icon {
font-size: 20px;
}
Regards,
Yigit
Hi Mauriweb!
Thank you for using Enfold.
Please use this on Quick CSS or custom.css:
#top .input-text, #top input[type="text"], #top input[type="input"], #top input[type="password"], #top input[type="email"], #top input[type="number"], #top input[type="url"], #top input[type="tel"], #top input[type="search"], #top textarea, #top select {
font-size: 13px !important;
line-height: 1.3em !important;
height: 30px;
min-height: 30px;
}
Cheers!
Ismael
I want to remove all 1px grayscale borders and backgrounds from tables. I tried pasting this in the quick style window, but it didn’t change anything:
td {
font-size: 13px;
padding: 9px 12px;
Hey!
You are welcome Justin. Yes, you can use following code
#footer ul.social_bookmarks li a {
font-size: 18px;
}
Regards,
Yigit
Okay thank you! Well the code inside the codeblock already have padding, in the css. But maybe I am doing something wrong? I don’t understand why it pushed the codeblocks together. This is what there is in the codeblock:
<div class=”ribbon”>
<h3>Worried?</h3>
<BR><span style=”font-size: 12pt;”><p>If you’re convicted of a crime, there can be devastating consequences.</p></span>
<p>
<BR>
[Read more]
</p>
</div>
And this is the css from custom.css file (the same code is also added in the mobile styles section):
.ribbon {
width: 240px;
margin: 10px auto;
padding: 0 10px 0;
position: relative;
color: #444;
background: #fff;
border: 1px solid #d2d2d2;
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
text-align: center;
font-size: 14px;
}
.ribbon h3 {
display: block;
height: 30px;
line-height: 1.3;
width: 260px;
margin: 0;
padding: 5px 10px;
position: relative;
left: -20px;
top: 8px;
color: #FFFDFD;
text-shadow: 0 1px 1px #2C6A92;
border-top: 1px solid hsl(203, 46%, 60%);
border-bottom: 1px solid hsl(203, 49%, 51%);
background: #81ADCC;
background: linear-gradient(top, #88B6D6 0%, #558DA3 100%);
border-radius: 2px 2px 0 0;
box-shadow: 0 1px 2px rgba(0,0,0,0.3);
font-size: 19px;
}
.ribbon h3::before,
.ribbon h3::after {
content: ”;
display: block;
width: 0;
height: 0;
position: absolute;
bottom: -23px;
z-index: -10;
border: 11px solid;
border-color: #486B8B transparent transparent transparent;
}
.ribbon h3::before {left: 0;}
.ribbon h3::after {right: 0;}
}
What is the problem? Can you please help me out?
Thank you!
Kind regards
Hi there.
The Avia editor proposes a content element of type ICON.
It works from a set of predefined icons, with a Font: entypo-fontello.
As I have some others icons libray in different size, I wonder how can we work with other icons in the enfold theme.
Thanks for any news.
Best regards,
Didier
Hey A!
Please add following code to Quick CSS and adjust as needed
#top .aviaccordion-preview-title-wrap { background: rgba(255,0,0,0.5); }
#top .aviaccordion-title { font-size: 22px; }
255,0,0 is RGB value of the color and 0.5 is opacity level. You can set opacity level between 0-1
Best regards,
Yigit
This reply has been marked as private.
Hey!
Try with this code:
#footer .widgettitle{
font-size: 24px;
color: red;
}
#footer .widget{
font-size: 14px;
color: green;
}
Cheers!
Josue
Unfortunately the only way to do that is to write custom css for their responsiveness.
You could try copying out the html that is generated by the buttons and see if LayerSlider is able to grab and modify it then. Ex:
<div class="avia-button-wrap avia-button-right "><a href="http://www.mangolanguages.com/libraries/" class="avia-button avia-icon_select-no avia-color-custom avia-size-large avia-position-right " target="_blank" style="background-color:#ffc425; border-color:#ffc425; color:#ffffff; "><span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title">FOR PUBLIC LIBRARIES</span></a></div>
and the next button:
<div class="avia-button-wrap avia-button-right "><a href="http://www.mangolanguages.com/academic/" class="avia-button avia-icon_select-no avia-color-custom avia-size-large avia-position-right " target="_blank" style="background-color:#8dbe3a; border-color:#8dbe3a; color:#ffffff; "><span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title">FOR ACADEMIC LIBRARIES</span></a></div>
http://support.girlmeetslake.com/newest-obsession-white-light-fixtures/
<?php
global $avia_config;
get_header();
if( get_post_meta(get_the_ID(), ‘header’, true) != ‘no’) echo avia_title();
?>
<div id=”av_section_1″ class=”avia-section main_color avia-section-default avia-no-border-styling avia-bg-style-fixed avia-full-stretch avia-builder-el-0 avia-builder-el-no-sibling av-minimum-height av-minimum-height-100 container_wrap fullsize” style=”background-repeat: no-repeat; background-image: url(http://i0.wp.com/support.girlmeetslake.com/wp-content/uploads/2014/08/background.jpg?resize=2500%2C1563); background-attachment: fixed; background-position: top center; ” data-section-bg-repeat=”stretch”>
<div class=”container”>
<main role=”main” itemprop=”mainContentOfPage” class=”template-page content twelve alpha units”>
<div class=”post-entry post-entry-type-page post-entry-25″>
<div class=”entry-content-wrapper clearfix”>
<div class=”flex_column av_one_fifth first avia-builder-el-1 el_before_av_three_fifth avia-builder-el-first ” style=”position: absolute; left: 0px; top: 0px;”>
<div class=”avia-builder-widget-area clearfix avia-builder-el-2 avia-builder-el-no-sibling “>
<section id=”nav_menu-2″ class=”widget clearfix widget_nav_menu” style=”position: relative;”>
<div class=”menu-menu-container”>
<ul id=”menu-menu” class=”menu”>
<li id=”menu-item-37″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-37″>home
<li id=”menu-item-38″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-38″>about
<li id=”menu-item-39″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-39″>portfolio
<li id=”menu-item-40″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-40″>mantra
<li id=”menu-item-41″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-41″>how it works
<li id=”menu-item-42″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-42″>contact
</div>
<span class=”seperator extralight-border”></span>
</section>
</div>
</div>
<div class=”flex_column av_three_fifth avia-builder-el-3 el_after_av_one_fifth avia-builder-el-last “>
<div style=”height:5px” class=”hr hr-invisible avia-builder-el-4 el_before_av_heading avia-builder-el-first “><span class=”hr-inner”><span class=”hr-inner-style”></span></span></div>
<div style=”padding-bottom:10px;” class=”av-special-heading av-special-heading-h1 blockquote modern-quote modern-centered avia-builder-el-5 el_after_av_hr el_before_av_textblock “><h1 class=”av-special-heading-tag” itemprop=”headline” style=”padding-bottom:10px;”>MELINDA FARANETTA</h1><div class=”av-subheading av-subheading_below” style=”font-size:29px;”><p>Homes that love the people inside.</p></div><div class=”special-heading-border”><div class=”special-heading-inner-border”></div></div></div>
<section class=”av_textblock_section” itemscope=”itemscope” itemtype=”https://schema.org/CreativeWork”><div class=”avia_textblock ” itemprop=”text”><p>
</p></div></section>
<?php
get_template_part( ‘includes/loop’, ‘custom-single’);
get_template_part( ‘includes/related-posts’);
comments_template( ‘/includes/comments.php’);
?>
</div>
</div>
</div>
</main>
</div><!–end builder template–>
</div>
<?php get_footer(); ?>
I tried to search but I didn’t see anything. I created some custom shortcodes and I’d like to use them inside the existing shortcodes but it doesn’t seem to work.
I have something like that:
[av_button label='Click me' link='manually,[LINK]' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='ue800' font='entypo-fontello']
and it breaks the button. Do you know how I could do that?
Thanks
Hi alexmasica!
Please add following code to Quick CSS
#top .avia-post-nav { background: rgba(0,255,0,0.6); font-family: helvetica; font-size: 16px; }
#top .avia-post-nav:hover { background: rgba(0,0,255,0.8); }
Regards,
Yigit
Was anyone able to help with this one and removing the thumbnail image? I’d also like to be able to edit the font sizes?
Cheers
Hi Slade!
1- Can you please try updating the page and if that does not work, re-creating that section?
2-
@media only screen and (max-width: 990px) {
h3.av-special-heading-tag { font-size: 24px; }}
Cheers!
Yigit
Hey!
To change the text, add this to the Quick CSS:
.grid-entry-title {
color: red;
font-size: 24px;
}
To change the image size try selecting a lower/higher number of columns in the portfolio grid options.
Regards,
Josue
Hi!
You need to lower the size of the first heading when on mobile, try adding this:
@media only screen and (max-width: 767px) {
.entry-content-wrapper h2.av-special-heading-tag {
font-size: 18px !important;
}
}
Regards,
Josue