Home › Forums › Weaver Xtreme Theme › How do I make a sticky menu that matches my Art Store Fronts shop?
- This topic has 50 replies, 3 voices, and was last updated 2 months, 3 weeks ago by
scrambler.
-
AuthorPosts
-
November 25, 2020 at 23:53 UTC - Views: 82 #66170
MaryAhern
ParticipantI’m trying to figure out how to match my self hosted site to a feature on my shop that is hosted by Art Store Fronts.
I’d like the Menu and the logo to remain at the top of the page when I scroll down using my Weaver Xtreme Plus.
Thanks!
…mary
My website: https://maryahernartist.com/
My Art Storefronts website: https://shop.maryahernartist.com/
November 26, 2020 at 02:27 UTC - Views: 80 #66171Weaver
KeymasterI don’t know of a way to match exactly. You can select an option that will make the menu stick at the top (but not fade in like the commercial site). (Customizer->Layout->Fix to Top on Scroll)
And built-in to Weaver Xtreme, the logo is either shown on the left or not.
It might be possible to define some CSS to have the logo on the left menu hidden until it sticks at the top, and by then the main header logo would be hidden. But @scrambler might be able to figure that one out.
November 26, 2020 at 02:36 UTC - Views: 94 #66172scrambler
ModeratorWe should be able to get pretty close after some tuning
- Add Your header image as the site logo in
Customizing > General Options & Admin > Site Identity > Logo - In Main Options > Menus > Primary menu bar > Fixed-top-menu > Select Fix to Top on Scroll
- Check Main Options > Menus > Primary menu bar > Add Site Logo to Top
- Set You menu background color to rgba(255,255,255,0)
Then Insert the rules below to the Theme Global Custom CSS Rule box, and post back with any issue leaving the rules in place
#header-widget-area {position:fixed;width:100%;left:0;top:0;}
#branding {z-index:2010;}/* Rule to define speed and start top property */
.wvrx-menu-container {transition:top .3s ease;top:-50px;}/* Hide Custom Logo when fixed */
#nav-primary .custom-logo-on-menu {display:none !important;}
#nav-primary .wvrx-fixonscroll .custom-logo-on-menu {display:block !important;}/* Rule to set the transition speed for both background and padding */
.wvrx-menu-container {
transition: background-color .5s ease, padding .5s ease;
}
/* Rule to change the background color and padding once the menu is fixed */
.wvrx-menu-container.wvrx-fixonscroll {
background-color:rgba(255,255,255,1);
padding-top:60px;padding-bottom:10px;
}The above CSS for the menu animation is detailed in the guide article below
“Fixed to Top on Scroll” Menus: Customization – Weaver Xtreme Guide (weavertheme.com)
November 29, 2020 at 22:21 UTC - Views: 76 #66193MaryAhern
ParticipantI tried to follow your instructions and here’s what I’ve found.
I now have two logos saying “Mary Ahern Artist”. (Corrected this problem by deleting the header image but both still show on my desktop, tablet & iPhone. The logo isn’t centered. The header image is)
The menu is at the top of both logos but what is scrolling on top is not the menu but a “Free Shipping Announcement”.
We’re getting there I think.
I left the code that was already in the Global CSS box & pasted yours below it.
Looking forward to your next fix!
…mary
November 30, 2020 at 00:16 UTC - Views: 76 #66195scrambler
ModeratorDuplicate image is because you need to hide the default logo image in
Main options > Header > Custom Logo > Hide WP Custom Logo > Hide on all devicesOn your other site the menu is below the header image, on this one it is above, is that on purpose?
If not, you need to uncheck “Move primary menu to the top” in the primary menu bar optionsYou did not set the menu to fix on Scroll so none of the fix on scroll can work
Main Options > Menus > Primary menu bar > Fixed-top-menu > Select Fix to Top on Scroll
Post back when all is in done
November 30, 2020 at 19:22 UTC - Views: 68 #66209MaryAhern
ParticipantBy hiding the
“Main options > Header > Custom Logo > Hide WP Custom Logo > Hide on all devices” I now don’t have any logo.
I unchecked the “Move primary menu to the top” and the menu is now again below where the logo would be.
I selected “Main Options > Menus > Primary menu bar > Fixed-top-menu > Select Fix to Top on Scroll” but the item that scrolls is a message in the Header Widget Area.
Please let me know what to do next.
Thanks!
…mary
November 30, 2020 at 20:30 UTC - Views: 67 #66213scrambler
ModeratorI am afraid we are not communicating or something is up…
First it looks like you removed your header image, you should have the header image set to you initial image, so that shows up above your menu like on your other site.
Your menu is still not using the fixed to top on scroll.
When you go to main Options > Menus > Primary menu bar > Fix top menu, do you actually see the option “fixed to top on scroll” being selected in the drop down list, or does it disappear after you set it and save?
Is the option Add Site logo to left Checked?
November 30, 2020 at 21:42 UTC - Views: 58 #66215MaryAhern
ParticipantHere’s a screenshot of my set-up.
Hope this helps.
…mary
November 30, 2020 at 21:47 UTC - Views: 57 #66217scrambler
ModeratorEither something is broken, or you have a cache issue.
Clear All your caches and check and post back.
Also, try changing some other settings, like changing a Background color to red, and see if that shows up in your site
November 30, 2020 at 21:57 UTC - Views: 55 #66218scrambler
ModeratorIf clearing your caches does not make the menu fix on scroll below are two other things to check/try
1- Are you using a plugin or a plugin option that does CSS/Javascript Optimization?
If you do, deactivate the feature/plugin, as optimization will break the theme javascript and CSS2- If not, try deactivating ALL non weaver plugin, and test if the menu becomes fixed on scroll. If it does, reactivate one by one testing in between to find the culprit.
November 30, 2020 at 23:22 UTC - Views: 53 #66220MaryAhern
ParticipantI deactivated all my plug ins and the widget at the top of the page. The menu still isn’t sticky. Please let me know if you have any success.
Thanks! …mary
November 30, 2020 at 23:26 UTC - Views: 49 #66221This reply has been marked as private.December 1, 2020 at 02:19 UTC - Views: 45 #66223scrambler
ModeratorAbsolutely!, you should never have more than one setting page open at a time, or they will cancel each other 🙂
So make sure you do NOT have the customizer open when going to Main Options >
Menus> Primary menu bar > Fixed menu option and save it
If that was not the issue (which I hope it was), I am at a loss of what is going on with your site.
Can you paste the content of the system information box here (Xtreme Admin > Theme Help > System information box
Also, do other options work, if you set the Primary menu bar background to red in Main options > Menus > Primary menu bar > BG box, and save, does it show up on the site?
December 1, 2020 at 03:25 UTC - Views: 61 #66224MaryAhern
ParticipantAlso, do other options work, if you set the Primary menu bar background to red in Main options > Menus > Primary menu bar > BG box, and save, does it show up on the site?
Yes they do. I set the menu bar to red & it changed so I set it back to white and it did that too.
Can I re-activate all my plugins now?
…mary
<h3>Weaver System Info ###</h3>
— WordPress Configuration —Site URL: https://maryahernartist.com/website
Home URL: https://maryahernartist.com
Multisite: No
Version: 5.5.3
Language: en_US
WP_DEBUG: Disabled
WP Memory Limit: 40M
Permalink: /%postname%/
Show On Front: page
Page On Front: HOME (ID# 3869)
Page For Posts: NEWS (ID# 72)
Current Theme: Weaver Xtreme (4.4.0.1)
Post Types: post, page, attachment, revision, nav_menu_item, custom_css, customize_changeset, oembed_cache, user_request, wp_block— Weaver Xtreme Configuration —
Weaver Xtreme Version: 4.4.0.1
Theme Support Version: 4.4.1
Xtreme Plus Version: 4.0— Server Configuration —
Operating System: Linux
PHP Version: 7.3.23
MySQL Version: 5.6.49
jQuery Version: 1.12.4-wp
Server Software: Apache/2.4.46 (Amazon) OpenSSL/1.0.2k-fips PHP/7.3.23— PHP Configuration —
Local Memory Limit: 256M
Server Memory Limit: 128M
Post Max Size: M
Upload Max Filesize: 40M
Time Limit: 30
Max Input Vars: 1000
Display Errors: N/A— WordPress Active Plugins —
Weaver II Theme Extras: 2.3.1
Weaver Show Posts: 1.5.1
Weaver Xtreme Plus: 4.0
Weaver Xtreme Theme Support: 4.4.1— WordPress Inactive Plugins —
AddToAny Share Buttons: 1.7.42
Akismet Anti-Spam: 4.1.7
Broken Link Checker: 1.11.15
Classic Editor: 1.6
Easy Theme and Plugin Upgrades: 2.0.1
Featured Page Widget: 2.2
Google Analytics for WordPress by MonsterInsights: 7.13.2
iThemes Security: 7.9.0
Jetpack by WordPress.com: 9.1
Link Manager: 0.1-beta
MailChimp Forms by MailMunch: 3.1.4
NextGEN Gallery: 3.4.7
NextGEN Pro: 3.1.2
Really Simple SSL: 4.0.3
Redirection: 4.9.2
W3 Total Cache: 0.15.2
Widget Shortcode: 0.3.5
WP Edit: 4.0.4
WPForms Lite: 1.6.3.1
WP Mail SMTP: 2.5.1
Yoast SEO: 15.3### End System Info ###
December 1, 2020 at 05:27 UTC - Views: 43 #66225scrambler
ModeratorYes, you can, but I have no clue why some of the options you set like “fixed to top on scroll” are not working.
I see in your list that you still have the Weaver II Theme Extras: 2.3.1 installed, that should not be there, please delete that plugin.
If that does not fix the issue, remove all the Custom CSS I had given you and post back so I can have one more look at the site.
Also, please put the text below in the primary menu Background color box
rgba(255,255,255,0)
December 1, 2020 at 05:36 UTC - Views: 33 #66226scrambler
ModeratorAlso after doing what I mentioned in my post right above, if Fixed to top on scroll shows as selected in the options and is still not working, do the following.
- Save your settings and download a copy locally for good measure from the SAve / Restore page
- Switch to a different theme
- Delete all weaver themes an plugins.
- Reinstall the Xtreme Theme and the Xtreme Theme support Plugin form WordPress and activate
- All settings should automatically be back
- Check if the Fixed to top on scroll is still selected in the primary menu options.
- Check if the menu is fixed.
- Download a fresh copy of the plus plugin from your weaver account and reinstall and activate that
- report back
- Add Your header image as the site logo in
-
AuthorPosts
- You must be logged in to reply to this topic.