-
Search Results
-
In reply to: Full-width slider font not matching others
I looked, and I can’t see any custom CSS that I put in there.
All the other top sliders match, but they are using h6 I believe. This home page doesn’t have the h6 option that I can tell. Only sizes. No option that I can see to change the font to match…Or, can you check your english in your answer. Maybe you mean that I “Should” add that, rather than I “added” that already?
Ugh. Please help…
In reply to: Adding Opt-in to Small Bar Above Logo Area?
Thank you, I’m getting closer to having it perfect!
I’d like to increase the size of the ‘Receive Free Winning Tips’ text on desktop, but this isn’t working:#header_meta h6 a, #header_meta h6{
/*size and spacing for small header bar text*/
font-size: 16px!important;
padding-right:15px!important;
}I’d also like to add a little bit of space on the right side of the text. I don’t want that text to be Open Sans, but would like the text in the actual form to be. Appreciate the help!
That looks good, Mike – thanks!
I did a little tweaking to the position and have it just right.Although in the process of all these adjustments, it seems the font size of my social icons is now the same on mobile and desktop. The size is supposed to be 26px on desktop?
Would you mind taking a look at that, please?
Also, should I remove the text we added to functions.php for the original plan with fontello?
I want to keep code tidy if I can.
Thanks again!In reply to: making title text larger in portfolio grid grid
Hey sensiblekaren,
Add this to quick css:
.page-id-895 .grid-content h3{ font-size:20px!important; }Adjust as you desire.
Best regards,
Jordan ShannonIn reply to: Avia builder debug code for demo
Hey fanlokbun,
1) You can activate the debug window by adding this code to the child theme functions.php file:
add_action('avia_builder_mode', "builder_set_debug"); function builder_set_debug() { return "debug"; }2) Kriesi used this shortcode to create the typing effect:
[av_headline_rotator before_rotating='Hi! I am Max and this is my portfolio. I can help you build a' after_rotating='Don’t be shy, get in touch!' interval='3' animation='typewriter' margin='40px,0,170px,0' tag='h3' size='5vw' align='left' custom_title='#0a0a0a' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av_uid='av-jffs3b9z' admin_preview_bg=''] [av_rotator_item title='beautiful logo.' link='' linktarget='' custom_title='' av_uid='av-9kdge'] [av_rotator_item title='successful brand.' link='' linktarget='' custom_title='' av_uid='av-dzkxq'] [av_rotator_item title='thriving business.' link='' linktarget='' custom_title='' av_uid='av-a9cdi'] [/av_headline_rotator]Best regards,
DudeIn reply to: Facebook Page widget
Dear Ismael,
thanks for your reply. I have now built my own work around using an iframe in a code block.
For those interested, here’s the solution:
I’m displaying a html file in an iframe to load a screenshot of the page-plugin with an overlay:
<iframe src="(...)/fb-click-page.html" width="xxx" height="yyy" style="border:none; overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>The html looks like this:
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> .container { position: relative; width: 100%; } div a { display: block ; height: 100% ; } .image-script { display: block; width: 100%; height: auto; } .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0; transition: .5s ease; background-color: #f3e417; } .container:hover .overlay { opacity: 1; } .text-large { color: black; font-size: 20px; font-family: Helvetica,Arial,sans-serif; position: absolute; top: 30%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; } .text-small { color: black; font-size: 12px; font-family: Helvetica,Arial,sans-serif; position: absolute; top: 80%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align: center; } </style> </head> <body> <div style="position: absolute; left: 0px;top: 0px; z-index: -1;" class="container"> <a href="(...)/fb-plugin/"><img src="(...)/fb-click-banner.jpg" width="xxx" height="yyy" class="image-script"> <div class="overlay"> <div class="text-large">Klicken Sie, um das Facebook-plugin zu aktivieren!</div> </a> <div class="text-small"> <b>Datenschutzhinweis:</b> <p>Beim Klick auf das Bild werden Daten an Facebook übertragen. Weitere Informationen erhalten Sie in unserer <a target="_parent" href="/datenschutz">Datenschutzerklärung</a>. </div> </div> </div> </body> </html>On clicking the overlay the fb-plugin page is load via yet another html file:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Load FB-Page Plugin</title> </head> <body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000"> <div style="position: absolute; left: 0px;top: 0px; z-index: -1;"> <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2F(...)&tabs=timeline&width=xxx&height=yyysmall_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="xxx" height="yyy" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe> </div> </body> </html>There’s a few minor issues with this workaround, as the facebook page-plugin is not responsive. Thus, once the iframe container becomes smaller than the loaded plugin, it is cut off at the sides. As I’m using it in a roughly 500px block it works well, as most devices provide 500px width.
Best regards,
AljoschaIn reply to: Menu font colours
Hi Mike,
thank you for your help.
The font colour is as I wanted it but the logo area heading is white and I would like it to be #143f3c as in the screenshot link (https://www.dropbox.com/s/k2vvnr47mytlk05/Screenshot%202018-07-03%2010.23.00.png?dl=0) both in full size and shrink.
As you have added this css does this mean that in the future if I wanted to make any similar changes that it has to be done through css again? Why isn’t the General Styling working?
George
In reply to: Enfold overide The Events calendar CSS settings
Hi Nikko,
Thing is, Enfold is not overiding a lot of Events Calendar Design, such as very small font-sizes and things. It look like the override is not working wel.
But since the answer took quit long I did all my changes with CSS and !important already.I believe it’s a good thing that Enfold wants to integrate it’s style to plugins but then it should work and not half like with Events Calendar.
Regards,
ArianeTopic: e-mail lay out
Hi guys i was wondering if it is possible to align the text from the contact forms in enfold.
So there is a little more space between the lines and also between the label and the answer.
And is it possible to change the font size as well?I hope to hear from you!
In reply to: Social Icons not Showing Up on Mobile?
Hi,
Try this:
@media only screen and (max-width: 767px) { #header_meta h6 a{ font-size:12px!important; margin-top:-35px!important; }}Best regards,
Jordan ShannonIn reply to: Comments and social share buttons under blog
Hi,
Add this to quick css:
.comment-entry h3.miniheading { font-size: 50px !important; } .comment-entry span.minitext { font-size: 30px !important; }Best regards,
Jordan ShannonIn reply to: Social Icons not Showing Up on Mobile?
Hi,
Add this to quick css:
@media only screen and (max-width: 767px) { .social_bookmarks a{ font-size:10px!important; }}Best regards,
Jordan ShannonTopic: Multiple size fonts LSP
How can this be acheived???
2 font sizes within one background with a line in-between (see attached)
In reply to: Headlines Style – modern left – Font size Subtitle
Hi Mike,
Thank you for you help, but… I placed this code to the Quick CSS field:.av-special-heading-h2, .av-special-heading-h2 h2,
.av-subheading-h2, .av-subheading-h2 h2,
.av-subheading_below-h2, .av-subheading_below-h2 h2,
.av-subheading_above-h2, .av-subheading_above-h2 h2
{
font-size: 30px !important;
}
.av-special-heading-h3, .av-special-heading-h3 h3,
.av-subheading-h3, .av-subheading-h3 h3,
.av-subheading_below-h3, .av-subheading_below-h3 h3,
.av-subheading_above-h3, .av-subheading_above-h3 h3
{
font-size: 22px !important;
}But, doesn’t work on my webside :-(
Any other ideas? Thank you,
Best regards,
EstherIn reply to: Comments and social share buttons under blog
Hi Mike,
Thanks for your reply.
The border worked. Great!
I not only want to adjust the fontsize of the comments but also the content of the text:
“Plaats een Reactie
Meepraten?
Draag gerust bij!”Is that possible?
Thanks in advance!In reply to: Menu font colours
Hello ,
On our site we have a slightly longer submenu line that gets broken in 2 lines , we would like to have it as 1 line.
Further more , we want to change the font style on some of the words in that submenu , like color , size , bold , etc
On our logo , we see it out of focus as we have uploaded a large enough logo in png format
Also slider pic looks zoomed in and whatever we do we see it pixeld .
We have sent login credentials .
Thanks
In reply to: table CSS
Got it!
/* Tabelle */
tr:first-child th, tr:first-child td {
font-size: 16px !important;
}
was not working./* Tabelle */
.table-responsive td {
font-size: 16px !important;
}works now, thanks
In reply to: Button to the right of some text
Hi Guenni007,
yes, it’s some text in Standard Editor with a button (with an anchor link in it) to the right of the text like:
Please find some more info under [av_button label='yummy pasta' link='manually,#example' link_target='' size='medium' position='center' label_display='' icon_select='yes' icon='ue81f' font='entypo-fontello' color='dark' custom_bg='#444444' custom_font='#ffffff' av_uid='av-b4b97' custom_class='' admin_preview_bg=''].
Hope this helps :-) .
Best regards,
SophieIn reply to: phone number above menu
Hi,
Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:
.phone-info span { color: #fff; font-size: 14px; }Best regards,
RikardIn reply to: Change title/text css for instagram widget
Hi Mike,
Thankyou for your reply. I’m sorry to say I can’t get the code to work. I has no effect on the visual, even with the “!important” add. Maybe some of my other code messes it up? Just copied your code below all mine in quick css. Like following:
.av-main-nav > li > a { font-family: "essonnes-display",serif; font-style: italic; text-transform: none; line-height: 1 !important; font-weight: 300; font-size: 18px; letter-spacing: 0px; color: #030405 !important; text-decoration: none !important; } #avia-menu li:hover a { color: #e94d26 !important; text-decoration: underline !important; } .main_color { border-color: #ffffff !important; } h1 { font-family: "essonnes-display",serif !important; font-style: normal; text-transform: none !important; padding-top: 10px !important; line-height: 1 !important; font-weight: 400 !important; font-size: 40px; letter-spacing: 0px !important; color: #030405; text-decoration: none !important; } h2 { margin-top: 0px !important; font-family: "essonnes-display",serif !important; font-style: normal; text-transform: none !important; padding-top: 10px !important; line-height: 1 !important; font-weight: 400 !important; font-size: 26px; letter-spacing: 0px !important; color: #030405 !important; text-decoration: none !important; } .avia_textblock { font-family: "essonnes-display",serif !important; font-style: normal; !important; font-style: normal; text-transform: none !important; padding-top: 10px !important; line-height: 1.4 !important; font-weight: 300 !important; font-size: 18px; letter-spacing: 0px !important; color: #030405; text-decoration: none !important; } @media only screen and (max-width: 767px) { .logo img { opacity: 0; } .logo a { background-image: url(https://gastroagency.dk/Wordpress/wp-content/uploads/2018/06/gastro_agency_logo_mobile3.gif); background-repeat: no-repeat; background-size: contain; }} .avia-instagram-feed h3.widgettitle { font-size: 70% !important; color: red !important; } a.av-instagram-follow.avia-button { color: red !important; } a.av-instagram-follow.avia-button:before { content: " Before \A"; white-space: pre; } a.av-instagram-follow.avia-button:after { content: "\A After"; white-space: pre; }Btw: I’m using the typekit for wordpress plugin…
In reply to: title in title bar always appears as permanent link
Ok,
now it works. There additionally had been another spec in the extended styling menu for H1. And now
#top .title-container.main-title, h1, .title_container .main-title {
font-size: 18px;
color: #666666;
font-weight: 700;
text-transform: uppercase;
}works fine.
Thanks,
JoergIn reply to: title in title bar always appears as permanent link
Mike,
thanks a lot, that works fine.
Now I tried to add the following in the Quick CSS section:h1.main-title.entry-title {
font-size: 30px;
color: #666666;
font-weight: bold;
}but nothing changes in the title section. Any idea?
Thanks,
JoergIn reply to: Problems moving logo to top in Maintenance mode
Hi,
I was trying to check your homepage but WordPress said someone else was working on it. So I created a new test page for you (Link in private content). Please check the font size settings and the custom ID options in color section working. You can also use a whitespace element and set a negative margin as I did in the example to reduce the space between the logo and the text below.
Hope this helps :)
Best regards,
VinayENGLISH: by webteam Isabel Morales Rey & Astrid Seng
The Enfold Theme is still in need of development and improvement
We muddled through Enfold for our customer http://www.kastner-brillen-haus.de and realized that we were quite disappointed with much within the theme and don’t want to call it user friendly yet. Too often we had to search for a quick CSS, because the theme didn’t take this into account and pre-programmed it for the user.
Here are a few points of criticism that we think could be improved:
01) The rollover effect for top navigation should not be assigned in two different locations with colors, but in one location. The trembling during rollover by narrowing the distance between the bushings should also not be specified as standard.
02) The different blog designs (classic or modern) should simply be pre-installed and selectable, instead of having to build them together first. We should also be able to select the categories simple and easy.
03) The side navigation at the blog is hardly visually designable. Line spacing, icons, font size color? We missed them.
04) The basic design with the headline above the photo is also not very appealing in the blog. The selection to change this is missing.
05) What is the strange ampersand symbol in the H1 line? That curly-blue thing “&” there?
06) As with top navigation, the second roll over color cannot be defined for the buttons. Why? Also here we had to search for a quick CSS. Roll-over, roll-out color and active-color, that’s what we always need didactically. Why don’t you make it easier for us users?
07) The scroll-to-top button in the footer is not visible on the smart-phone. Here also we had to make do with an additional quick-CSS. That doesn’t have to be the case.
08) Why are the module symbols in your page builder “Avia Layout Architect” so light grey and not more clearly visible?
09) Why doesn’t the link setter recognize the mail address automatically and doesn’t put it in the href line like in other themes?
10) The number of icons you provide. Sad.
11) Why do you automatically color the bolt headlines in the body text? I just want it bold, not colored. They look like links. This is simply a no go didactically. Here also you specify this and do not let the user have the freedom to design it himself.
12) Where can I modify the color of the social icons?
13) Where can I modify the design of the sharing icons?
14) Why does the save button not run in the page builder view or is at least displayed again at the end below? So you have to scroll constantly upwards to save or activate.
15) Too bad that you have equipped your slider so unspectacularly and have not integrated the great RevolutionSlider.
16) Also for your Masonry Gallery we had to use a Quick-CSS to disable the excited fluttering in of images. The animation comes too late and also very delayed when scrolling down. For the user it then looks as if there would be an empty space and there would be nothing more information. Also here we miss a clean and clear choice when creating this gallery: Activate animation, change animation, deactivate animation and the images remain visible (loaded) from the beginning.
Working with Enfold took a lot of unnecessary time, it was quite frustrating and lengthy working with Enfold. We know much better premium themes. I hope with the Gutenberg-Step there will be some changes and you will catch up to keep up with the current theme.
.
.
.
GERMAN: by webteam Isabel Morales Rey & Astrid SengDas Enfold Theme empfinden wir als noch recht entwicklungsbedürftig und verbesserungswürdig
Wir haben uns für unseren Kunden http://www.kastner-brillen-haus.de durch Enfold durchgewurstelt und festgestellt, dass wir mit vielem innerhalb des Themes recht enttäuscht waren und das Theme noch nicht als UserFriendly bezeichnen möchten. Zu oft mussten wir nach einem Quick CSS suchen, weil das Theme das nicht für den User als Einstellung mit bedacht und vorweg programmiert hat.
Hier ein paar Kritikpunkte, die unserer Meinung nach verbesserungswürdig sind:
01. Der RollOver Effekt bei der Topnavigation sollte nicht an zwei unterschiedlichen Orten mit Farben, sondern an einem Ort vergeben werden. Das Zittern beim RollOver durch Verengung des Buchstenabstandes bitte auch nicht als Standard angeben.
02. Die unterschiedlichen Blogdesigns (Classisch oder Modern) sollten einfach schon mal vorinstalliert und auswählbar sein, statt sich das erst zusammen bauen zu müssen. Auch die Kategorien sollten wir simple and easy danach auswählen können.
03. Die Side Navigation beim Blog ist kaum optisch designbar. Zeilenabstand, Icons, Schriftgröße Farbe? Haben wir vermisst.
04. Ebenso das Grunddesign mit der Headline über dem Foto ist optisch nicht besonders ansprechend im Blog. Die Auswahl dies zu ändern fehlt.
05. Was ist das mit dem seltsamen Kaufmannsund in der H1 Zeile? Dieses kringelblaue Dingens “&” da?
06. Bei den Buttons sind wie bei der TopNavigation auch hier wieder die zweite RollOver Farbe NICHT definierbar. Warum? Auch hier mussten wir nach einen Quick CSS suchen. RollOver, RollOut Farbe und AktivFarbe (visited), das benötigen wir didaktisch eigentlich immer. Warum macht ihr es uns User nicht leichter?
07. Der ScrollToTop Button im Footer ist bei den SmartPhone nicht sichtbar. Auch da mussten wir uns mit einem zusätzlichen Quick CSS behelfen. Das muss doch nicht sein.
08. Weshalb sind bei eurem PageBuilder die Modulsymbole so hellgrau und nicht deutlicher sichtbar?
09. Weshalb erkennt der Linksetzer die Mailadresse nicht automatisch und setzt sie in die href Zeile wie bei anderen Themes gleich ein?
10. So wenige Icons stellt ihr bereit. Traurig.
11. Warum färbt ihr automatisch die Bold-Headlines ein? Ich will sie nur bold haben, aber nicht eingefärbt. Sie sehn aus wie Links. Das ist didaktisch einfach ein no go. Auch hier gebt ihr das vor und lasst den User nicht die Freiheit das selbst zu gestalten.
12. Wo kann man die Social Icons farblich modifizieren?
13. Wo kann man die Sharing-Icons im Design modifizieren?
14. Weshalb läuft der Speichern-Button bei der PageBuilder Ansicht nicht mit oder wird zumindest am Ende unten erneut dargestellt? So muss man ständig nach oben scrollen, um zu speichern, bzw. zu aktivieren.
15. Schade, dass ihr euren Slider so unspektakulär bestückt und nicht den tollen RevolutionSlider integriert habt.
16. Auch bei eurer Masonry Gallery mussten wir uns mit einem Quick-CSS behelfen, um das aufgeregte Hereinflattern von Bildern zu deaktivieren. Die Animation kommt zu spät und auch erst beim Hinscrollen sehr verzögert. Für den User sieht es dann so aus, als wäre dort ein leerer Platz und es käme nichts mehr an Information. Auch hier vermissen wir eine saubere und klare Wahlmöglichkeit beim Erstellen dieser Gallery: Animation aktivieren, Animation verändern, Animation deaktivieren und die Bilder bleiben dann von Anfang an sichtbar (geladen).
Das Arbeiten mit Enfold hat uns viel unnötige Zeit gekostet, es war recht frustrierend und langatmig mit Enfold zu arbeiten. Da kennen wir viel bessere PremiumThemes. Ich hoffe mit dem Gutenberg-Step wird sich bei euch noch einiges ändern und ihr holt etwas auf, um mit dem gegenwärtigen Themestand mithalten zu können.
Hey bauchope,
When I look at your table the background color for all of the rows are #f2f2f2, so I wrote the css to make the other rows white.
I was not sure what font size you wanted for the pricing row, so I made it half size, 30px, please feel free to adjust to suit.
I also added a 8px border-radius, but again feel free to adjust to suit.
This is the css I added to your WordPress > Customize > Additional CSS:#top.home .avia_pricing_minimal.avia-table-1 .pricing-table>li:nth-child(even) { background: #fff !important; } #top.home .avia_pricing_minimal.avia-table-1 .pricing-table li.avia-pricing-row { font-size: 30px !important; } #top.home .avia_pricing_minimal.avia-table-1 .pricing-table>li { border-radius: 8px; } #top.home .avia_pricing_minimal.avia-table-1 .pricing-table { box-shadow: none !important; }For your full width easy slider on mobile, I added this css to your WordPress > Customize > Additional CSS:
@media only screen and (max-width: 480px) { ul.avia-slideshow-inner { min-height: 150px !important; height: 150px !important; } .av_slideshow_full li, .av_slideshow_full .avia-slide-wrap, .av_slideshow_full li img { height: 100% !important; } }Please clear your browser cache and check.
Best regards,
MikeIn reply to: Headlines Style – modern left – Font size Subtitle
Hey Esther,
You can target the h2 & h3 special heading with the classes “.av-special-heading-h2” & “.av-special-heading-h3”
or with “.av-special-heading-h2 h2” & “.av-special-heading-h3 h3”
Like this:.av-special-heading-h2, .av-special-heading-h2 h2{ font-size: 70% !important; color: blue !important; } .av-special-heading-h3, .av-special-heading-h3 h3{ font-size: 70% !important; color: yellow !important; }notice the two class types are separated with a comma to target all of them, as an example. I would recommend adding your page or post classes to each rule because using them globally can cause some unexpected changes.
The sub-headings use the classes “av-subheading” or “av-subheading_below” or “av-subheading_above”
Please give these a try, if you still have trouble, please post a link to the page and explain what you want and we will assist.Best regards,
MikeIn reply to: Change title/text css for instagram widget
Hi,
To adjust the “… out and about” for the instagram widget, Try this code in the General Styling > Quick CSS field:.avia-instagram-feed h3.widgettitle { font-size: 70% !important; color: red !important; }adjust to suit.
To change the button font color, try this css:a.av-instagram-follow.avia-button { color: red !important; }To add text before (above) & after (below), try this css:
a.av-instagram-follow.avia-button:before { content: " Before \A"; white-space: pre; } a.av-instagram-follow.avia-button:after { content: "\A After"; white-space: pre; }
To have the text before & after inline with the button text, please remove the “\A” from the code.Best regards,
MikeIn reply to: Comments and social share buttons under blog
Hi,
To adjust the font-size of the comment area Try this code in the General Styling > Quick CSS field, the top rule is the heading and the next one is for the content:.comment-entry h3.miniheading { font-size: 70% !important; } .comment-entry span.minitext { font-size: 70% !important; }To add a border around the text area, Try this code in the General Styling > Quick CSS field:
.comment-form-comment textarea#comment { border-color: red !important; }Best regards,
MikeTopic: Catalogue font size
Hi,
For some reason I don’t manage to change the catalogue font size. I have used this code in Quick CSS:
.av-catalogue-title {font-size: 14px !important; }
.av-catalogue-price {font-size: 14px !important; }
.av-catalogue-content {font-size: 11px !important; }What is wrong with this? How could I get smaller font size?
HI,
have another question related to the css file you provided for this styling. There is a lot of stuff in it which feels to me that I’m not using it at this moment, like all the shopping cart codes.
Is this useful for something even it is not in use? Or can I delete all redundant code?
Doesn’t it effect also the performance?
If so, could you give me a short “index” of what is necessary code for this issue here and what not – thanks!
Of course I have already saved a copy of your original code provided, just in case I would need it later on.But unfortunately I did not saved the first one, where these color and font-size settings were in, and now I’m thinking that it would be better to write the font settings into the css file and delete at Enfold > Advanced Styling all the related settings. This way I could add also the still missing style for bold and active state color for the submenu.
Would it be possible to provide me a short example / snipped of css code for font setting at the main menu, and if appropriate, where to place it in the css file.
Would appreciate this a lot.
Thank you very much,
Britta
