-
Search Results
-
In reply to: Landing Page Issues
Hey!
You can set the font size on mobile device with this:
@media only screen and (max-width: 767px) { .av-inherit-size .av-special-heading-tag { font-size: 1em; }}Cheers!
IsmaelThat helped a lot. Thanks!
For the curious the full solution which worked for this instance is:
Edit loop-index.php and add if ( is_single() ) { avia_social_share_links(); } between the span and the header close tag:echo '</span>'; if ( is_single() ) { avia_social_share_links(); } echo '</header>';Also change to the following code in loop-index.php
echo '</span>'; echo "<span class='text-sep text-sep-date'>on</span>"; echo "<time class='date-container minor-meta updated' $markup>".get_the_time(get_option('date_format'))."</time>"; echo '</span>';In style.css add
/* INDIVIDUAL BLOG POST TEMPLATE STYLING ================================================== */ .entry-content p { font-family: Georgia,Cambria,"Times New Roman",Times,serif; font-size: 1.125rem; line-height: 1.6; padding: auto 15px !important; } .entry-content p a { font-family: Georgia,Cambria,"Times New Roman",Times,serif; } div.entry-content { padding: 15px 15px 5px 15px; } .post-meta-infos { top: 0; } .post-meta-infos, .vcard.author span.fn a { font-size: 1em; } .post-meta-infos .text-sep, .post-meta-infos .date-container { color: #7e7e7e; } header.entry-content-header { padding: 15px 15px 5px 15px; } .single .entry-content-header .av-share-box { margin: .5em 0 2.5em; } .av-share-box ul li a { font-size: 2.3em; }In reply to: Issue with layout 1/4 column on tablet
Hi,
Sorry for the late reply. I’m not sure what the problem was with the special headers but you can set both markup (h1-h6) and font size, so a difference in size is most likely just different settings for the elements. Please let us know if we can help you out further on the topic.
Regards,
RikardH Kriesi!
I love the Enfold theme and I’m very happy to have chosen it for my new site. My site is clean, well organized, user friendly (even for me!) and I love how it’s shaping up! This is my first EVER website and first time working with WordPress, so please excuse my ignorance.I’m building a local directory (shop local campaign) for our area and the plug-ins and add-ons I’m using work well with Enfold. However, I do have one issue I’d like to fix somehow.
The titles that are on the breadcrumb bar seem too disjointed or unconnected from my posts (which are business and event listings – 3 different CPTs). I was planning on keeping my search bar on listings, and If I do that, the Enfold title shows ABOVE the search bar, very disconnected to the listing (See pics). If I disable the search bar, the title is still too close to the menu and not prominent with the listing. I tried playing with font size but that made things worse. Another big thing is some of the titles are long and they run into my breadcrumbs and cause a mess. I like having my breadcrumbs and I’d like to keep them. I also don’t need the title HOME on my home page, or BLOG on my blog page, for instance, but I do need titles on my listing pages.
I was able to turn off the Enfold titles in the breadcrumb bar by adding some CSS I found in this forum’s archives to the custom CSS in the child theme. That solved the unwanted titles on pages and in the breadcrumb bar. However, I DO want titles on my business and event listings (posts)…and here lies my problem.
I’m assuming that there is some code in the Enfold theme that overrides the existing titles?? Is there a way to reactivate those titles that are associated with the posts? I’d love for my listing titles to be directly above the listing photos (see pics). Is this even possible?? I’m not code savvy, and I would be willing to pay someone to fix this for me, if indeed there is a fix and it is beyond my capabilities. I plan on launching my business and site this week and would love for my paying customers to see their business and event titles in all their glory.
I totally totally understand Enfold wasn’t developed with this use (directory) in mind, but I surely love this theme and I would love to keep using it.
Thank you so much for your kind assistance!
Cheers! Kris
Ok, thanks!
I also had to add something for the phone info, that is:
#header_meta .phone-info { font-size: 13px !important; font-weight: normal !important; }but everything combined solves the problem!
Thanks!In reply to: A few problems i need help with please!
Hey!
Try adding this to Quick CSS / child style.css:
.single-product .single_variation > .price { display: none !important; } .inner_product_header h3 { font-size: 22px !important; }Best regards,
JosueIn reply to: MailChimp Integration
Hey Jagrav!
You could add the CSS code to the Form you want to affect, enclosed in
<style></style>tags:.mc4wp-form form{margin:0!important;clear:both} .mc4wp-form p br{display:none} .mc4wp-form label{display:block;visibility:visible;position:relative;margin-bottom:7px;font-weight:600} .mc4wp-form p{position:relative;clear:both;float:left;width:100%} .mc4wp-form p.hidden{position:absolute;width:0;left:0;top:0} .mc4wp-form .form_element_half{width:49.5%;float:left;margin-left:1%;clear:none} .mc4wp-form .form_element_third{width:32.6%;float:left;margin-left:1%;clear:none} .mc4wp-form .form_element_two_third{width:66.4%;float:left;margin-left:1%;clear:none} .mc4wp-form .form_element_fourth{width:24.2%;float:left;margin-left:1%;clear:none} .mc4wp-form .form_element_three_fourth{width:74.8%;float:left;margin-left:1%;clear:none} .mc4wp-form .first_form{clear:both;margin-left:0} @media only screen and (max-width: 479px) { .responsive .mc4wp-form .form_element{width:100%;clear:both;margin-right:0;margin-left:0;float:none} } #top .mc4wp-form input[type='text'],#top .mc4wp-form input[type='email'],#top .mc4wp-form select,#top .mc4wp-form textarea{width:100%;margin-bottom:0;display:inline;min-width:50px;padding:13px;border-radius:2px} #top .mc4wp-form select{-webkit-appearance:none;border-radius:0;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAANCAYAAAC+ct6XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBNYWNpbnRvc2giIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RjBBRUQ1QTQ1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RjBBRUQ1QTU1QzkxMTFFMDlDNDdEQzgyNUE1RjI4MTEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGMEFFRDVBMjVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGMEFFRDVBMzVDOTExMUUwOUM0N0RDODI1QTVGMjgxMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk5mU4QAAACUSURBVHjaYmRgYJD6////MwY6AyaGAQIspCieM2cOjKkIxCFA3A0TSElJoZ3FUCANxAeAWA6IOYG4iR5BjWwpCDQCcSnNgxoIVJCDFwnwA/FHWlp8EIpHSKoGgiggLkITewrEcbQO6mVAbAbE+VD+a3IsJTc7FQAxDxD7AbEzEF+jR1DDywtoCr9DbhwzDlRZDRBgACYqHJO9bkklAAAAAElFTkSuQmCC);background-position:center right;background-repeat:no-repeat;border-radius:2px} .mc4wp-form .button{margin:0;padding:16px 20px;border-radius:2px;border-bottom-width:1px;border-bottom-style:solid;font-weight:400;font-size:12px;min-width:142px;outline:none} .mc4wp-form .modified_width .button{width:100%;padding:13px 10px 14px;min-width:0} .mc4wp-form p input,.mc4wp-form p textarea,.mc4wp-form p select{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out}Regards,
JosueHello,
I want to add a border over one of my menu items (that works) but also have an icon showup beside the item when hovered over. I tried doing this with the navigation label: Products [av_font_icon icon_hover='aviaTBaviaTBicon_hover' icon='ue835' font='entypo-fontello' style='' caption='' link='' linktarget='' size='15' position='right' color=''][/av_font_icon].
However, the icon is always present and the border does not cover the icon. See link in private content.
Anyway I can have the icon only show up on hover and have the border around the text AND icon?
Thanks in advance
In reply to: Icon Sizes Inside Sonar Circles
Hey!
You can override the style with this:
#top .av_font_icon a:before { font-size: 30px; position: relative; left: -8px; top: 5px; }This is going to work for the icon with the 10px font size.
Regards,
IsmaelIn reply to: CSS Mouseover with Text box has copy showing over it
Hi Andy,
I’m back to trying to make this work: I have a link that needs to have a popup window on hover for a risk disclosure. I have set up a span with CSS, but even though I have the background specified as #ffffff, it seems like the order of elements has this on the bottom so when the hover window open up there is copy from the bottom of the page that is over the hover window. I need to have only the copy in the hover window showing when it is open. There is also z-index specified and I have tried changing this, but doesn’t help.
Here is the link to the page, hover over “Learn More” in the sidebar to see what I am talking about.
http://hriver.spottedmoondesigns.com/Maybe there is an easier, or better, way to accomplish what I am trying to do, if so any help would be sooooo appreciated.
Thanks, JenniferHere is the CSS I’m using:
span.dropt {border-bottom: thin dotted; background: #ffffff; margin: 8px;}
span.dropt span {position: absolute; right: -9999px; margin: 20px 0 0 0px; padding: 3px 3px 3px 5px; border-style:solid; border-color: #666666; border-width:1px; background: #ffffff;}
span.dropt:hover span {left: 1%; background: #ffffff;}
span.dropt span {position: absolute; right: -9999px; margin: 20px 0 0 0px; padding: 3px 3px 3px 5px; border-style:solid; border-color: #666666; border-width:1px;}
span.dropt:hover span {margin: 20px 0 0 0px; background: #ffffff;}I’m using the Enfold Start Up Business theme and I want to change the Font & Size of the text for the “Recent Posts” Menu. I went to the Advanced Styling options and the Sidebar Options but don’t see an option for that particular menu. Can you help?
Thanks!
Hey Carl Emil!
Thank you for using Enfold.
This is the default styling of the heading tag which works well on retina displays.
.products .product h3, .products .product h4, .products .product h5, .products .product h6 { padding-top: 5px; font-size: 1em; line-height: 1.3em; font-weight: normal; margin: 0; }And this is your own css modification in the style.css file which is not retina ready:
.inner_product_header h3 { font-family: "brandon-grotesque"; font-size: 16px !important; font-weight: bold !important; text-transform: uppercase; letter-spacing: 0.14em; color: #0a4d6d; }You can use css media queries specifically for retina displays: https://css-tricks.com/snippets/css/retina-display-media-query/
Best regards,
IsmaelIn reply to: Issue with layout 1/4 column on tablet
Hi Dake,
Yes, me too :-)
The issue of the <h2> font size I hadn’t mentioned yet in another topic before. However, also for the same website I had some other issues, see:
- https://kriesi.at/support/topic/issue-with-layout-grid-on-small-mobiles/
- https://kriesi.at/support/topic/issue-with-layout-testimonials-on-tablet/
In the end this client accepted different lay-outs and that solved the issues for this website, but I guess when you offer these kind of lay-outs, that they should work fine!?
My question therefore was about if these kind of issues are being taken into consideration when the theme is going to be updated again?
Best regards,
MoniqueI’ve been trying different CSS changes, but can’t seem to get a left margin applied to blog post. I am able to change the font size and color of the title of the post.
In reply to: Schriftgröße auf allen Endgeräten gleich
Hi,
You can use the following CSS for the main menu:
#avia-menu .avia-menu-text { font-size: 20px !important; font-weight: bold !important; }And the following for the top menu:
#header_meta #avia2-menu a { font-size: 16px !important; font-weight: bold !important; }Best regards,
RikardIn reply to: Fullwidth Button Font Size / Heading Style
Hey!
Can you please try adding !important rule
.page-id-56 #are-you-ready-for-an-unforgettable-experience .avia_iconbox_title { font-size: 24px !important; }Regards,
YigitIn reply to: Fullwidth Button Font Size / Heading Style
Thanks Yigit! I entered the code but it does not work. I adjusted the font size value larger and it still does not adjust the font size.
In reply to: Grid Row Layout – only one image showing
Hey!
All I see is one image element. Your trying to recreate the four images on this demo page correct? http://kriesi.at/themes/enfold-shop/
First off do this, http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/.
And then add this to the debug view and save.
[av_layout_row border='' min_height='0' color='main_color' mobile='av-flex-cells' id='collections'] [av_cell_one_fourth vertical_align='top' padding='0px' padding_sync='true' background_color='' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat'] [av_image src='http://kriesi.at/themes/enfold-shop/files/2015/03/winter-girl-small-495x400.jpg' attachment='551' attachment_size='portfolio' align='center' animation='no-animation' styling='no-styling' hover='av-hover-grow' link='product,66' target='' caption='yes' font_size='' appearance='' overlay_opacity='0.7' overlay_color='#6786a1' overlay_text_color='#ffffff'] NEW WINTER COLLECTION [/av_image] [/av_cell_one_fourth][av_cell_one_fourth vertical_align='top' padding='0px' padding_sync='true' background_color='' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat'] [av_image src='http://kriesi.at/themes/enfold-shop/files/2015/03/couple-sitting-495x400.jpg' attachment='546' attachment_size='portfolio' align='center' animation='no-animation' styling='no-styling' hover='av-hover-grow' link='product_cat,15' target='' caption='yes' font_size='' appearance='' overlay_opacity='0.7' overlay_color='#6786a1' overlay_text_color='#ffffff'] LATEST STREET CLOTHES [/av_image] [/av_cell_one_fourth][av_cell_one_fourth vertical_align='top' padding='0px' padding_sync='true' background_color='' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat'] [av_image src='http://kriesi.at/themes/enfold-shop/files/2015/03/girls-shopping-desat-495x400.jpg' attachment='549' attachment_size='portfolio' align='center' animation='no-animation' styling='no-styling' hover='av-hover-grow' link='product_cat,12' target='' caption='yes' font_size='' appearance='' overlay_opacity='0.7' overlay_color='#6786a1' overlay_text_color='#ffffff'] FRESH SPORTSWEAR [/av_image] [/av_cell_one_fourth][av_cell_one_fourth vertical_align='top' padding='0px' padding_sync='true' background_color='' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat'] [av_image src='http://kriesi.at/themes/enfold-shop/files/2015/03/hipster-girls-working-495x400.jpg' attachment='554' attachment_size='portfolio' align='center' animation='no-animation' styling='no-styling' hover='av-hover-grow' link='product_cat,10' target='' caption='yes' font_size='' appearance='' overlay_opacity='0.7' overlay_color='#6786a1' overlay_text_color='#ffffff'] FUNKY ACCECCOIRS [/av_image] [/av_cell_one_fourth] [/av_layout_row]Regards,
ElliottIn reply to: Fullwidth Button Font Size / Heading Style
Hey djshortkut!
Please add following code to Quick CSS and adjust as needed
.page-id-56 #are-you-ready-for-an-unforgettable-experience .avia_iconbox_title { font-size: 21px; }Regards,
YigitIn reply to: Header problems on iPad
Hi Dake,
link to the website is in the private data below.
(You don’t need access to the Admin area, do you? Otherwise, please let me know.)As also said in my other recent request:
I very much appreciate your help, but shouldn’t these issues be addressed in the Enfold theme itself, that is, for everyone?Best regards,
CarstenPS: Also as said in my other recent request: I’m aware that Enfold is focused on configuring the via the WordPress Admin area, but wouldn’t it be much easier in cases like this to have a well-documented, user-modifyable LESS or SCSS source file?
In reply to: Enfold Combo Widget CSS
Hey nigdowser!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
.avia_combo_widget * { font-size: 13px!important; }Cheers!
YigitIn reply to: Various problems with mobile responsiveness
Hi!
You can replace the code with this to exclude desktop view from being affected:
@media only screen and (min-width: 989px) { .av-inner-masonry-content-pos { font-size: 6px; }}Best regards,
IsmaelIn reply to: menu bar, main navigation
1) This is the code I used for the main menu I think: .main_menu ul:first-child > li > a { background-color: #FFFFFF; opacity: 0.8 } and the sub-menu: .sub-menu, .sub-menu * { background: #FFFFFF; opacity: 1!important; font-size: 13px!important; color: #5e5a5a!important; }
I have searched for “fullwidth menu” and tried out different codes but they don’t work for me. Probably because my menu bar is very customized. Is it still possible? I’ll post my login credentials again below if it helps you to look into my CSS.2) Some menu points still have the blue line when adding this code…? The first 2 and the last one don’t have it but the ones in between still show the line.
3) The shuffle mode has been disabled… doesn’t help.
4) I have downloaded that plugin and will see what I can do!
Thanks!
AlineTopic: Enfold Combo Widget CSS
Hi,
Could you please point me at the right selectors to make the text in the combo widget larger. I’ve increased the font size of the site and the widget needs to catch up with the new size.
Thanks!!
Can you provide me some quick css so I can change the font size of the fullwidth button on this page? I want to make it heading style H2. Thanks in advance!
Hi Elliott,
thanks for your quick reply, but unfortunately, there is a ton of problems with these settings:
- Main Menu Links has no setting for the font weight!
- Small bar above Main Menu has color settings (font, background, border), but no font size, weight, …
- Side note: Small bar above Main Menu — the color picker for the font color doesn’t work, clicking with the mouse does not update the color at all.
- Both Main Menu Links and Small bar above Main Menu — if a font color is set, the color is the same for all menu items; the distinction between “current page” and other pages is lost.
So the Advanced Styling doesn’t help at all, please help (change the size and weight of the main menu items and the text in the topmost bar).
PS: There is no preview for new forum posts or replies (must submit immediately without preview), and in the Enfold forum, it is quasi impossible to access the forum search…
Hey CarstenF!
You can do this in Dashboard > Enfold > Advanced Styling. Create a new rule for the main menu level items and you can change the font weight, size, color, etc etc.
Best regards,
ElliottIn reply to: Various problems with mobile responsiveness
Hi Yigit,
thanks for your quick help! It finally works on IPads – however, now the captions’ font size is waaaaay to small on my desktop computer. Could you please provide me with codes, which only change font size and height of the captions on mobile devices? Thanks a lot.
Best regards,
G.
In reply to: Just Got Started and Need Help on Multiple Fronts
Hey
Thank you for your kind words and for choosing Enfold :)
1- Please go to Enfold theme options > Header > Transparency options and change menu colors to white. Seems like you figured this one out. If you would like to change the color of phone number, please add following code to Quick CSS in Enfold theme options under General Styling tab
.av_header_transparency .phone-info a { color: white!important; }2- Using custom CSS is better. You can add following code to Quick CSS field
.av-subheading.av_custom_color { opacity: 1; }3-
.home .av-subheading a { text-decoration: none!important; font-size: 20px; }4- You can add your machines as portfolio items so you can categorize them and sort them if needed.
5- Please go to Enfold theme options > Advanced Styling and edit “Main menu links”
6- Which device are you using? I checked your website on my iphone and it does show up fine on my end – http://i.imgur.com/krkwWtT.pngBest regards,
Yigit
