If you go to http://www.pswebdesign.com the nav menu on loading is in white text and also the contact details. Some of my customers have complained that this is hard to read is there anyway I can darken these two sections whilst keeping them transparent prior to scrolling down see screenshot
Hello Andy,
I’m sorry for the belated reply.
parallax scrolling on mobile is deactivated by default
That is some useful information! So the bug is caused by the parallax effect on desktop, which can’t be reproduced on mobile.
How can I allow parallax scrolling on desktop but disabled it on mobile? I know it is disabled by default, but right now it is still causing problems for my mobile.
If the first one is working for you, then with media queries it should work fine, too.
Unfortunately, it does not. I provided the LogIns for you Mods. Feel free to quickly test yourself. It does not work.
I feel it would be best for you to work together with a freelance developer on those issues, especially if you want to customize things
I don’t want any customisation necessarily. I just want the mobile page to either not display as a very long list because of only one icon is being shown at a time, or hide columns on mobile which are unnecessary because the content (parallel effect picture) isn’t being shown anyway.
I should be able to set these within Enfold, but it does not work.
BG,
SonicTonic
Hi,
To make the logo center menu below in mobile version:
1. Hide the mobile menu and center the logo using the below CSS.
@media only screen and (max-width: 767px) {
#advanced_menu_toggle, #advanced_menu_hide {
display: none !important;
}
.logo a > img {
left: 50%;
transform: translateX(-50%);
}
}
/*Show only in mobile or desktop*/
@media only screen and (min-width: 769px) {
.only_mobile { display: none !important; }}
@media only screen and (max-width: 768px) {
.only_desktop { display: none !important; }}
2. Please enable the custom css class field: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/
3. Create a header widget area by applying the code provided in this link to functions.php http://kriesi.at/documentation/enfold/adding-a-widget-area-to-the-header/
4. Please enable debug mode by adding the code provided in this link to your functions.php file which can be accessed from Appearance > Editor http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/
This let’s you view the shortcode for all the page elements.
5. Create a new page for testing purpose and add a fullwidth submenu element. We need to show the fullwidth submenu only in mobile to do so please add the class name “only_mobile” in custom css class name option.
7. Copy the shortcode which should look similar to the below code to Appearance > Header .
[av_submenu which_menu='center' menu='' position='center' color='main_color' sticky='true' mobile='disabled' mobile_submenu='']
[av_submenu_item title='Menu Item 1']
[av_submenu_item title='Menu Item 2']
[/av_submenu]
Best regards,
Vinay
Hi,
Please try the solution in this thread: https://kriesi.at/support/topic/mobile-search-bar/
Best regards,
Nikko
Hey!
We added the following css code in the Quick CSS field. If possible, please move it in the style.css file so that it will be applied on all languages
@media only screen and (max-width: 1024px) {
.responsive #top #wrap_all #header {
position: relative;
width: 100%;
float: none;
height: auto;
margin: 0 !important;
opacity: 1;
}
.responsive #top #wrap_all .container {
width: 85%;
max-width: 85%;
margin: 0 auto;
padding-left: 0;
padding-right: 0;
float: none;
}
.responsive #top .logo {
position: static;
display: table;
height: 80px !important;
float: none;
padding: 0;
border: none;
width: 80%;
}
.responsive .logo a {
display: table-cell;
vertical-align: middle;
}
.responsive .logo img {
height: auto !important;
width: auto;
max-width: 100%;
margin: 0;
display: block;
max-height: 80px;
}
.responsive #header_main .inner-container,
.responsive .main_menu {
position: static;
}
.main_menu .avia-menu, #header_main_alternate,
.fallback_menu {
display: none;
}
.responsive #top #main {
padding-top: 0 !important;
margin: 0;
}
.container #advanced_menu_toggle,
#advanced_menu_hide {
display: block;
}
.responsive.html_header_sidebar #top #header .social_bookmarks {
display: none;
}
}
Regards,
Ismael
Hi
I would like to have a fixed background image and place my text in 50% opacity color sections on top, so that you can still see the image behind. Is that possible? I have found a homepage (see link below) how has it, and it is something like that i want.
Please let me know how to :)
Hi Rikard,
Thanks for that. Both bits of CSS work.
I would like to know why it’s happening? What element or configuration of elements is causing this so I can avoid it in the future.
I just noticed that it also seems to affect my socket styling on desktop too. Like if you look on the other pages the socket social icons are more spread out. Weird.
Thanks.
Hi!
Please add this css code to adjust the menu padding which will also fix the background.
#top #header li.current-menu-item > a .avia-menu-text {
padding: 9px;
}
Best regards,
Ismael
Hey webzillauser!
Thank you for using Enfold.
1.) That is the default template of the single product pages. The sidebar is actually below the featured image container. If you want a left or right sidebar, please do the following modification.
// https://kriesi.at/support/topic/sidebar-rechts-single-page/#post-580220
2.) The category title is inside the banner.
Best regards,
Ismael
Hi Rikard,
you can close the topic, everything worked great.
Thank you!
Alessandra
Hey!
Alright. We adjusted the css media query to 1248px:
@media only screen and (max-width: 1248px) {
#menu-item-search-mobile {
display: block !important;
}
#top #searchform {
text-align: center;
}
#top #menu-item-search-mobile #searchform > div {
display: inline-block;
}
}
Where did you add the following code?
@media only screen and (min-width: 767px) {
#top #searchform {
position: absolute;
top: 90px;
}
}
Please remove that one.
Best regards,
Ismael
Hi,
Glad we could help. Please let us know if you should need any further help on the topic.
Best regards,
Rikard
I switched from Go Daddy due to the nonstop 502 and 503 errors… they started last November and if you read their support forums for Managed WordPress, they have continued since then. I was pulling my hair out. This is not a theme issue. I switched to WP Engine and am happy with them but there are many hosting providers that are much better than Go Daddy. Make the switch away from GD, you won’t regret it. I wish someone had given me this advice 2 years ago! Good luck.
Hi Thomas,
Great, glad you got it working and sorry for the problems. We should hopefully have a fix released for this as soon as possible. Please let us know if you should need any further help on the topic.
Best regards,
Rikard
Hi,
Please activate debug mode in order to see shortcodes: http://kriesi.at/documentation/enfold/enable-advanced-layout-builder-debug/
You can then paste the following shortcode where you want it:
[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='https://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='https://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='https://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='https://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]
Best regards,
Rikard
Hi Joel,
Great, glad you found a solution and thanks for sharing. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
Hi Alessandra,
Great, glad we could help and thanks for the feedback. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
Hi,
Ok, glad it started working again. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
Hi!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
#top #wrap_all .av-social-link-goodreadsicon:hover a {
color: white;
background: orange;
}
Best regards,
Yigit
Hi Harris!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 768px) {
.responsive #top .logo {
margin-top: -45px;
}
#advanced_menu_toggle {
top: 23%;
}}
Regards,
Yigit
Hi there,
This problem overflowed into another thread, where Yigit told me that I probably couldn’t fix without hiring a developer. I am closing that thread now, and before closing this one too, I would like first to confirm here as well, that this can’t be fixed with simple CSS:
The sub-menu has a weird space at the top of the page when I scroll down. Any idea on how to make it connect to the top?
Thank you!
Hi Yigit,
This worked perfect for Mobil, thanks a lot !….I added the snippet to my functions….
I was wondering if there was a way to stop it from Displaying on my main page. I did not notice it before, but when I resize my home page the H1 Company name also shows up.
thanks !
Ed
Hi again!
Sorry, my bad! I left the initial full stop out of the syntax!
All working fine now, thanks for your wonderful help!
A
Please go to the new link I have provided in private. Add the product to the cart. Next, at the top right where the cart icon is, Mouse over and you will see the cart dropdown has a blue background. I want the whole dropdown background white (solid, not transparent) and the text a slate/black color. I do not want to change ANY other menu/link attributes besides the cart dropdown. So far, no one can seem to help me with it. I have obviously been able to edit just about every other custom CSS I used to create the site…but this one is confusing…and my changes I have tried to make looking at the dev. view on frontend won’t stick – even with “!important” – PLEASE HELP!
LParticipant
Is there a fix for this issue? I have been searching the whole support forum, but any topics reported this issue for a long period of time on different Enfold versions got the answer about some ‘conflicting’ plugins and did not retrieve any valuable solution. I have got the same error on your site using this theme http://kriesi.at/wp-content/themes/enfold/framework/ and the theme demo http://kriesi.at/themes/enfold/wp-content/themes/enfold/framework/ both returning 403.
This is bad for SEO because Google hates errors. Is there a temporary fix for this? This is not a site-specific question but more like a bug report.
Regards
Please see the first post in this thread (blockquoted below), where I did those tests preemptively, knowing I’d be asked to do that. At the time, everything was fully up to date, WordPress, Enfold, plugins, etc. I even disabled plugins, stopped using a child theme, etc, etc. So unless something suddenly changed in WordPress 4.7.1 or 4.7.2 that fixed this, or Enfold changed in some way to fix this, I’m not sure why re-testing would heed different results. Plugins were eliminated and so was the child theme, so those were innocent as per my tests. Though, it is odd that you can’t seem to reproduce it. Anyway. I’ll see if I can revisit this in the future – workload is too high right now and I am able to circumvent this issue by avoiding massive page titles.
In any case, thanks for looking into this.
We’re running WordPress 4.7 and the latest versions of all our plugins.
Here’s what I already tried:
- Deactivating all plugins
- Updating to the latest version of Enfold
- Switching from using an Enfold Child Theme to using a pure Enfold parent theme
- Deleting W3 Total Cache and all traces of it
- Looking for errors via WP_DEBUG_LOG – nothing seen
- Looking for errors via Firebug/Chrome Developer tools – nothing visible
The problem is still reproducible despite this.
Hello,
On the first load of the page the items on the masonry elements will show all but if you reload some of the item will get stack on top of the other item and it looks like the other items did not load but it did.
my masonry settings will load all the items from the portfolio and at the moment there are 96 entries. please see the link provided
I have read the old threads regarding same issue but it did not help.
Thanks Niko! I’ve read over those articles and some others and started to design the page for “Mobile First”. I am creating 3 different image sizes for each “point break”. Here is the new page: http://www.wedsheet.com/l2/
I am having a couple issues that maybe you can help with…
1. On the 2nd section (“Everything you need to…”), the image looks good on desktop and tablet, but shrinks down really small on mobile: http://quirktools.com/screenfly/#u=http%3A//www.wedsheet.com/l2/&w=414&h=736&a=37&s=1
Do you know why that might be? And how would I fix that?
2. The text size on the 2nd section (“Everything you need to…”) stays very large when on mobile…how would I reduce that just on smaller screens?
Thanks!
Dave