Hi all,
I use Enfold as new theme for an existing site.
Now I wonder why the menu in the left sidebar doesn’t show my original menu texts (e.g. Home) but my h1 headlines.
How can I stop this? I prefer short texts for the menu.
And how can I put the h1 on top of the main content, beneath the title bar with a slider?
Thank you!
Michael
Hi Ismael,
I’m sorry, but that doesn’t answer my question. I already fixed the smart phone view issue, now I just want to figure out how to center the text in each text box on the slider. It looks centered in the preview mode prior to publishing, but once published, the text starts that the top of the text box, rather than remaining centered.
Thanks!
Dani
Hi i would need a little more top-spacing for my logo. it crashes in the menubar.
how do i ad a few pix top-padding to logo?
than kyou
Hey!
We have added the below css please check the site. :)
/* remove padding*/
.content, .container {
padding:0!important;
}
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all .container {
width: 100%!important;
max-width: 100%!important;
}
}
Regards,
Vinay Kashyap
Hi!
Try with this:
#top .av-video-slide .avia-slide-wrap {
background-color: white !important;
}
Regards,
Josue
Hello,
For desktop devices i have this error: Eliminate render-blocking JavaScript and CSS in above-the-fold content and my score is about 80/100. This is very important as you already know for adwords.
https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fwww.srizos.gr%2Fkiles%2Fvouvonokili&tab=desktop
Can you please help me or provide me a fix for that?
Hi!
It didnt work, but i tried this:
@media only screen and (min-width: 769px) {
.only_mobile { display: none !important; }}
@media only screen and (max-width: 768px) {
.only_desktop { display: none !important; }}
Now its working like a charm!
Thanks
/lena
-
This reply was modified 10 years, 2 months ago by
LenaAson.
Hi Vinnie, thanks for the reply, I just want the Houzz icon of the top header works the same as the rest.
onmouseover event: with blue box color and onmouseout event: without blue box color.
Thanks and regards.
Nicolás
Hi erwin_m!
please add the below code to Enfold > General Styling > Quick CSS
.header-scrolled .logo img {
min-height: 80px;
top: -17px;
}
Regards,
Vinay Kashyap
Hey!
To change the title size please add the below code to Enfold > General Styling > Quick CSS
feel free to adjust the font size to suit your needs :)
/*Change title size */
#top .aviaccordion-title {
font-size: 34px!important;
}
Regards,
Vinay Kashyap
Hi guys,
Is there a way to make a button or link at the top of a page that makes the page scroll to another lower block on a page so you can keep the information on the same page but easy to find for people?
Marcel
-
This topic was modified 10 years, 2 months ago by
vossenm.
Hi!
As Ismale mentioned to hide and display elements please follow the post link
If you need more control on ALB elements enable custom css class support and add custom class and target them via css http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
To push the button a little below so it won’t overlap the logo please add the below code to Enfold > General Styling > Quick CSS
@media only screen and (max-width: 768px) {
#header .widget {
padding-top: 140px;
}
}
Cheers!
Vinay Kashyap
Hello,
A couple more questions about re-sizing images in the Upcoming Events Widget (from post #577471)
Please see the widget at http://rotarycentreforthearts.com/ – Upcoming Events section
Question 1
A few images are being disproportionately re-sized from a rectangle to a square. Examples include Feel the Rhythm Drum circle (pg 1) and Salsa Thursdays (pg 2). They only seem to source the original image.
Other events with proportionately re-sized images reference multiple image versions and re-size a square version instead. Is it possible to do this for all images in this widget?
Question 2
When a user clicks page 2 of the Upcoming Events widget, the whole page is reloaded and the user is bumped to the top of the page. Is it possible to just reload the section and remain at that point on the page?
Thanks
Hi
I followed these instructions here: http://kriesi.at/documentation/enfold/remove-image-titles-that-show-up-when-you-hover-on-images/
It worked but, this is creating a conflict with a google translator plugin and the flags for such plugin disappear after adding this code.
If you reload the page you can see the flags at the top right and then disappear.
Please check the page in PVT
Thank you
I’m trying to get my site to look like this page:
http://www.bornwildproject.com/new-page-3-1/
Where the image spans the full width, is responsive, but is only a few hundred pixels high.
I can’t find an existing thread that deals with this specifically.
Secondly, is there any control for fullscreen slider or other that would allow for display of an image like the second one on this page (the mountains in background with sun flare and no people on it) where both the above and below content layers seem to float up over the background image that is also moving? Using fullscreen slider seems to achieve this for the bottom but not the top layers.
Thank you so so much. I really appreciate the help!
i have an issue similar to this:
https://kriesi.at/support/topic/layerslider-wp-dynamic-content-from-posts/
in the last thread josue says “You can’t select the first 8 in the same layer, you’d need to create 8 layers and select the 1st, 2nd, 3rd in each one respectively”.
i try with no result, i have 5 different layers with the same blog post.
i’ve already deactivate all plugins and install a fresh copy of theme files, but nothing works.
I’m fiddling around with enhanced link attribution as well. Based on the way Enfold is coded the menu items in the header do not have unique element ids, but, the <li> does.
`id=”menu-item-5123″ class=”menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-mega-parent menu-item-top-level menu-item-top-level-2″>
<a href=”http://www.xxxxx.com/products/”><span class=”avia-bullet”></span><span class=”avia-menu-text”>Products</span><span class=”avia-menu-fx”><span class=”avia-arrow-wrap”><span class=”avia-arrow”></span></span></span>`
Button classes however do not appear to have element ids as shown below:
`<div class=”avia-button-wrap avia-button-center avia-builder-el-22 avia-builder-el-no-sibling “>
<a href=”http://www.xxxxx.com/products/cps/”><span class=”avia_button_icon avia_button_icon_left ” aria-hidden=”true” data-av_icon=”” data-av_iconfont=”fontello”></span><span class=”avia_iconbox_title”>Browse Products</span>
</a>
</div>`
I have only checked these two elements. But if there’s no unique element for things like buttons, and, if for the header all I will get in my GA report is something like menu-item-5123 (I suspect) then it doesn’t seem all that useful. I’m wondering if it’s even worth implementing.
Thoughts?
-
This reply was modified 10 years, 2 months ago by
Frank.
thank you very much, Vinnie
works fine for mobile and desktop
Hi skeereweer!
Please add the below code to Enfold > General Styling > Quick CSS
The code will make the blog look similar to the screenshot below.
please enable css class support http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
Add a custom class name and use it with the below code.
@media only screen and (max-width: 480px) {
.custom-class .responsive #top #wrap_all .slide-entry {
width: 100%!important;
}
.custom-class .responsive #top #wrap_all .slide-entry a{
background: transparent!important;
}
}
Cheers!
Vinay Kashyap
-
This reply was modified 10 years, 2 months ago by
Vinay.
Hi,
I am trying to adjust the top margin for .av-special-heading by using custom class:
cw-notoppadding
.av-special-heading .cw-notoppadding {
margin-top:10px !important; }
Doesn’t work.
PS: We just purchased our 7th copy of Enfold:)
Hi Ismael.
Thank you for the response. working with grid row elements does allow me to place images as background.
The problem with images as background is the aspect ratio (which I completely forgot).
With different sized windows the section is deformed due to incapability of images to resize both width and height without adjusting the aspect ratio. So I can not continue using an Image with text without the image deforming.
I created a new solution with an Avia Layout Element. But is there any way to link a layout element and all its content?
I now have an element containing a background image, cell padding 60px from the top and placed a special header, a textblock and an image at the bottom of the cell. I want the visitor to redirect to a different page as soon as he clicks somewhere in the cell.
Best regards,
Bart Altena
-
This reply was modified 10 years, 2 months ago by
alteba. Reason: minor grammar adjustments, so you guys better understand
Hi peanuttario!
Use the following selector
#top .main_color input[type=”text”] { }
and it will work for you.
Let us know if you need anything else
Regards,
Basilis
Hello,
I am trying to get the Layer Slider to stop fading in when the page loads. It looks horrible when there is just this blank space where the slider should be before the image fades in. I have already set its global settings to not animate first slide and that didn’t do anything. Thank you for your help.
Hey!
You can add it somewhere near top :)
Cheers!
Yigit
Hi!
Please add following code to Quick CSS
#top .social_bookmarks {
height: auto;
}
#top .social_bookmarks li a {
line-height: 45px;
}
That should help :)
Best regards,
Yigit
Hey silberrot!
– You can add Comments element under Content Elements tab of Advanced Layout Builder manually ( same goes for Social Share Buttons as well)
– You can edit your post and click “Screen options” on the top right of the screen and check “Excerpt” and then add your excerpt into Excerpt field.
Best regards,
Yigit
I’d llke to have a button that opens a lightbox containing a mailchimp form. I like Enfold’s native Mailchimp form, and I have it on the page. However, for design purposes, I want to also be able to open a form by clicking on a button. That could open either the native enfold mailchimp form or one of mailchimp’s general or embedded forms. Is there a way to do this?
I saw the post https://kriesi.at/support/topic/using-button-shortcode-to-open-a-video-in-a-lightbox/ and tried using <span class=”avia”>Youtube</span> (substituting the real form url, of course. And I just left in the Youtube words during testing.) However, this didn’t open the form. Additionally, I’d prefer the button to look like http://snag.gy/IMozm.jpg
yes i thought of that too – but i want a margin (or padding – concerning to what the rule goes (html, body or wrap_all) on top.
if this marging could not be seen all the time it would be ok for me if the header scrolls to top and begins then to shrink and is fixed on top.
But to look nice it has to scroll first than on top it starts to shrink and gets the fixed positioning.
now the header and main and all the rest is seen when it passes the header which is sticky with that distance above.
Hey Guenter!
Please add following code to Quick CSS
#header.header-scrolled {
top: 0;
}
Best regards,
Yigit