-
Search Results
-
In reply to: menu overlapping logo when resizing browser window
Hey,
Please add this on your custom.css or Quick CSS:
@media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive .main_menu ul:first-child > li > a {
padding: 0 6px;
font-size: 10px;
}
.main_menu {
margin-right: -50px;
}
.logo img {
width: 140px;
}
}Regards,
Ismael
In reply to: Laptop 1366×768 acting like mobile device
Hi,
1.) Add this on your custom.css or Quick CSS, adjust the height according to the height of the header when you it shrinks.
.header-scrolled #header_main .container {
height: 58px !important;
line-height: 58px !important;
}2.) This the code that controls the arrow:
#top .avia-slideshow-arrows a {
font-family: 'entypo-fontello';
display: block;
text-decoration: none;
color: #fff;
visibility: visible;
position: absolute;
width: 60px;
text-align: center;
height: 60px;
line-height: 62px;
font-size: 25px;
top: 50%;
margin: -30px 15px 0;
z-index: 99;
overflow: hidden;
text-indent: -600%;
}Regards,
Ismael
In reply to: Remove serch button from header
Hi,
1.) I think you managed to remove the search button.
2.) Remove the custom.css that you added:
.main_color a {
color: #f05a1a !important;
}Use this instead:
.main_color .post-title a {
color: red !important;
}3.) Use this:
body {
font-size: 14px;
}4.) Edit header.php, find this code:
<div id='header_main' class='container_wrap container_wrap_logo'>Add the google search code below.
Regards,
Ismael
In reply to: Change Navigation Text
Hey,
You can modify this code on your custom.css or Quick CSS:
.main_menu ul:first-child > li > a {
display: block;
text-decoration: none;
padding: 0 13px;
font-weight: normal;
font-weight: 600;
font-size: 15px;
}You can change the color of the menu, using this:
.header_color .main_menu ul:first-child > li > a {
color: red;
}Hover state with this:
.header_color .main_menu ul:first-child > li a:hover
color: blue;
}Can you please specify which headings?
You can change the overall font on Enfold > Styling > Defines the Font for your body text.
Regards,
Ismael
Hi,
my site link is http://career.guru99.com/
I am using your enfold theme.i want some customization in the theme.
1) Remove search button from header
2) apply different color to title and links to differentiate between them
3) enlarge font size to 14px
so how can i do this
4)how to include google search in header
see this image for what i am actually need
http://screencast.com/t/gTwaghZo
please help
Topic: Change Navigation Text
I would like to change the navigation text style, How might i be able to do this.
Also change text font and size for headings.
Thanks
Michael
In reply to: Shortcode doesn't render in promobox
Hey,
Sorry my bad. It is not working when using the Promo Box. Please use the actual html generated by each shortcode. This is the code generated by a button shortcode for example:
<div class="avia-button-wrap avia-button-center avia-builder-el-1 avia-builder-el-no-sibling "><a href="" class="avia-button avia-icon_select-yes avia-color-theme-color avia-size-small avia-position-center "><span class="avia_button_icon avia-font-entypo-fontello">♥</span><span class="avia_iconbox_title">Click me</span></a></div>Regards,
Ismael
In reply to: Shortcode doesn't render in promobox
Hey,
Please switch your theme to debug mode. Edit function.php, find this code:
if(isset($avia_config['use_child_theme_functions_only'])) return;Below, add this code:
//set builder mode to debug
add_action('avia_builder_mode', "builder_set_debug");
function builder_set_debug()
{
return "debug";
}You will be able to see the actual shortcode below the builder. Shortcodes can be combine then, like this example. A combination of Promobox shortcode plus the Button shortcode:
[av_promobox button='yes' label='Click me' link='single' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='large' icon_select='no' icon='25']
Welcome Stranger! This is an example Text for your fantastic Promo Box! Feel Free to delete it and replace it with your own fancy Message!
[av_button label='Click me' link='' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='25']
[/av_promobox]Regards,
Ismael
Hi,
Did you use a Mega Menu for this item? Please check it first, disable the mega menu if you accidentally enabled it on Appearance > Menus > About.
Then add this on your custom.css or Quick CSS:
#top #header .mega_menu_title a {
font-size: 11px;
line-height: 11px;
color: #808080;
}Regards,
Ismael
In reply to: Easy Slider – Increase Text / HEading LIne – Height
I forgot to say, this is all the Quick CSS I have – in case this is causing a conflict, but it worked fine before I added the second Full Width Slider on the same page:
#top .social_bookmarks li {
float: right;
}
.sub_menu {
left: 0;
}
html {
background: white !important;
}
#top .social_bookmarks_mail:hover a{color:#efefef; background-color:#666666; }
.iconlist-char {color:#0093dd;}
.avia-icon-list .iconlist_icon {
background: white !important; border: 2px solid #0093dd;
}
#top #socket .social_bookmarks {
position: absolute;
right: 0;
}
@media only screen and (min-width: 786px) and (max-width: 1000px) {
.avia-icon-list .iconlist_icon {
height: 50px;
width: 50px;
line-height: 50px;
font-size: 25px;
margin-right: 15px;
}
}
.avia-caption-content h4 {
line-height: 20px;
}
Thankyou
In reply to: Mobile menu tablet breakpoint
Hey,
Please add this on your custom.css or Quick CSS to avoid the menu overlapping the logo:
@media only screen and (max-width: 767px) {
.main_menu ul:first-child > li > a {
padding: 0 8px;
font-size: 12px;
}
}Edit js > avia.js, find this code:
switchWidth = 768;
if(first_level_items > 7 && !bottom_menu)
{
switchWidth = 989;
header.addClass('mobile_menu_tablet');
}Replace the first switchWidth value to 990.
Regards,
Ismael
Hi,
where can i control the appearance of the Headers h1 – hx ?
z. Bsp. font size, uppercase and so on.
Thanks in advance.
ridcon
In reply to: CSS location for changing headers etc & tables.
Hi,
If you are talking about the main title, you can use this on your custom.css or Quick CSS:
.title_container .main-title {
margin: 0;
font-size: 30px;
position: relative;
z-index: 2;
min-height: 36px;
line-height: 2.3em;
top: 0;
font-weight: 400;
}Table css can be found on css > base.css > #Table.
Regards,
Ismael
In reply to: Menu overlap on ipad portrait
Hi,
Please decrease the switchWidth value. I think the css code will work:
@media only screen and (max-width: 1100px) and (min-width: 1024px) {
.responsive .main_menu ul:first-child > li > a {
padding: 0 8px;
font-size: 12px;
}
}Like I said, there is still no fix on instances when you rotate the iPad from landscape to portrait view without refreshing the page.
Regards,
Ismael
I give up tried looking via developer tools, but too new to CSS to figure out where to change the headings for blog entries. I managed to change them to a different font with the google font plugin but cannot change the size and they are way too small for the blog entry posts. I need to be able to change them & I also need to be able to override your table preferences as they are interfering with a plugin I use called tablepress (I will use your tables when they become as versatile!).
In reply to: Enlarge hover icon on images
Hi artistic24459,
Your original rgba color code is incorrect because its rgba and you don’t have an alpha value. So it should just be rgb.
The icon is a font so if you want it larger you just increase the font size (its the best thing about using font file for icons!).
For example, this gives you a gray overlay with a giant icon:
.image-overlay {
position: absolute;
background: #333;
z-index: 500;
height: 100%;
width: 100%;
opacity: 0;
filter: alpha(opacity=0);
}
.image-overlay .image-overlay-inside::before {
content: "E744";
font-family: 'entypo-fontello';
font-size: 120px;
font-weight: normal;
}
.image-overlay .image-overlay-inside::before {
position: absolute;
border-radius: 50px;
background: #000;
height: 80px;
width: 80px;
line-height: 80px;
left: 50%;
top: 50%;
margin: -40px 0 0 -54px;
z-index: 500;
text-align: center;
color: #fff;
}
a:hover .image-overlay .image-overlay-inside {
-webkit-animation: avia_pop_small 0.5s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);
-moz-animation: avia_pop_small 0.5s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);
-o-animation: avia_pop_small 0.5s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);
animation: avia_pop_small 0.5s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275);
}I included the animation just so you can have it as a reference. If you wanted everything to only effect the portfolio on that page you could use the page ID selector as a prefix to your other selectors.
Hope this helps.
Regards,
Devin
In reply to: Blog strong class="main title" change to h1 class
Hey,
You can use this:
.title_container .main-title {
margin: 0;
font-size: 40px;
position: relative;
z-index: 2;
min-height: 36px;
line-height: 2.3em;
top: 0;
font-weight: 400;
}Regards,
Ismael
We would like to change the blog page “strong class=”main title” to be an h1 class like the other pages in the theme. We modified the CSS so that the font size is bigger but it is not modifying the blog “news” page
You can see the page here.
http://13015.duvosoftware.com/news/
Thanks for the help
In reply to: Enfold Feature Requests
i would like a easier way to set the fonts sizes sitewide, i am happy with the theme but i honestly don’t understand why this great theme does not have font sizes in the theme admin panel fot easy change.
Now we have to put css for every part we want to change.
so please add this
In reply to: Colour Section Image Not showing on iPad / iPhone
Hi Nick,
I have several additions in my Quick CSS from previous queries, could this be what is causing the problem? (below):
I have the fullscreen easy slider in the footer, but haven’t used the layer slider, do you mean I should delete this element anyway, even if not used?.
Thanks Nick,
Gary
#top .social_bookmarks li {
float: right;
}
.sub_menu {
left: 0;
}
html {
background: white !important;
}
#top .social_bookmarks_mail:hover a{color:#efefef; background-color:#666666; }
.iconlist-char {color:#0093dd;}
.avia-icon-list .iconlist_icon {
background: white !important; border: 2px solid #0093dd;
}
#top #socket .social_bookmarks {
position: absolute;
right: 0;
}
@media only screen and (min-width: 786px) and (max-width: 1000px) {
.avia-icon-list .iconlist_icon {
height: 50px;
width: 50px;
line-height: 50px;
font-size: 25px;
margin-right: 15px;
}
}Hey,
You can change font size using CSS:
.main_menu ul:first-child > li > a {
font-size: 15px;
color: red;
}Menu color:
.header_color .main_menu ul:first-child > li > a {
color: red;
}Active menu color:
.header_color .main_menu ul:first-child > li.active-parent-item > a {
color: blue;
}Please give a specific list of items you want to change, we’ll help you with it.
Regards,
Ismael
In reply to: special-heading-border color
Hi,
I think you are confusing something, because h5 refers to a type of a font size designated as a heading. header elements normally do not have borders, though they often enough reside in div or span tags that have such a border. Please show a URL where something like what you describe can be found in order for us to give you a meaningful solution.
Thanks,
Nick
In reply to: Icon Images
Hi,
Those are not images but glyphs , a font much the same as any other font but instead of letters they have those symbols. if you look at your text editor you can add one with a shortcode (magic wand with yellow glow button on top of text editor) , then you can give it font size 190px or so and it will look like a large image though it is selectable as any regular font.
thanks,
Nick
I cannot find an option to change all the font sizes of menu items, content, titles etc. I assume that a great theme like this has this option standard in the theme options to make an easy change in font size.
Where can i change all the font sizes?
please advice
grtz
desch
In reply to: Menu overlap on ipad portrait
Hi Ismael,
great, thanks for that!
I have entered as mentioned above to http://www.musikzentrale.net, but here is what happens now:
resizing the browser window below 1030px both now, the main menu AND the mobile menu, show up. when i go under 1013px in width, the logo vanishes, but still both menus are there, main and mobile. The main menu disappears when i go below ~780px
here is my setting, anything wrong with that?
IN AVIA.JS
‘function avia_responsive_menu()
{
var win = $(window), header = $(‘.responsive #header’);
if(!header.length) return;
var menu = header.find(‘.main_menu ul:eq(0)’),
first_level_items = menu.find(‘>li’).length,
bottom_menu = $(‘html’).is(‘.bottom_nav_header’),
switchWidth = 1024;
if(first_level_items > 8 && !bottom_menu)
{
switchWidth = 1100;
header.addClass(‘mobile_menu_tablet’);
}’
AND IN CUSTOM CSS:
‘@media only screen and (max-width: 1100px) and (min-width: 1024px) {
.responsive .main_menu ul:first-child > li > a {
padding: 0 8px;
font-size: 12px;
}
}’
Thanks for your help
Regards, SEbastian.
PS: I am not really aware of what i am doing with those entries, it is more a guessing thing ;-)
Greetings!
I really do love this theme!!!! It is beautiful!
I have been scouring through this support site for advice and for someone to have asked this question…and wish to goodness I could find a way to do this without having to ask for help, but alas…I have not been able to find the answer or have any success with attempts I have made.
I want to be able to define the font properties (font size, font family, etc.) for the header, footer and possibly other areas around the site.
I can’t seem to locate the area where the code should be updated. I have tried copying snippets into the CSS quick box, under styling, but that doesn’t seem to do anything.
Thank you sooooooooo much in advance!
In reply to: Menu overlap on ipad portrait
Hey,
Please replace this with code:
bottom_menu = $('html').is('.bottom_nav_header'),
switchWidth = 900;with:
bottom_menu = $('html').is('.bottom_nav_header'),
switchWidth = 1024;and this:
if(first_level_items > 8 && !bottom_menu)
{
switchWidth = 900;
header.addClass('mobile_menu_tablet');
}with
if(first_level_items > 7 && !bottom_menu)
{
switchWidth = 1100;
header.addClass('mobile_menu_tablet');
}Remove browser cache the reload the page.
Don’t forget to add this css code on your Quick CSS:
@media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive .main_menu ul:first-child > li > a {
padding: 0 8px;
font-size: 12px;
}
}Regards,
Ismael
In reply to: Footer CSS text size
Hey,
You can add this on your custom.css or Quick CSS
.execphpwidget p, .execphpwidget strong, .execphpwidget span {
font-size: 11px !important;
}Regards,
Ismael
In reply to: Width of Special Heading in mobile
Hi,
Please add this on your custom.css or Quick CSS:
@media only screen and (max-width: 767px) {
.av-special-heading h3 {
font-size: 14px;
line-height: 20px;
}
body .av-special-heading > * {
white-space: pre-wrap;
width: 600px;
}
}Regards,
Ismael
In reply to: Problems finding where to change the font size
