[ Kinh nghiệm wordpress ]

How To Create A Sticky Header In WordPress

❤️ 𝗝𝗼𝗶𝗻 𝗼𝘂𝗿 𝗕𝗲𝗴𝗶𝗻𝗻𝗲𝗿 𝗪𝗼𝗿𝗱𝗣𝗿𝗲𝘀𝘀 𝗖𝗼𝘂𝗿𝘀𝗲 |

👉𝗛𝗼𝘄 𝘁𝗼 𝗠𝗮𝗸𝗲 𝗠𝗼𝗻𝗲𝘆 𝘄𝗶𝘁𝗵 𝘆𝗼𝘂𝗿 𝘄𝗲𝗯𝘀𝗶𝘁𝗲 ➜

🌐 𝗖𝗼𝗻𝘁𝗮𝗰𝘁 𝘂𝘀 𝗳𝗼𝗿 𝗪𝗲𝗯 𝗗𝗲𝘃𝗲𝗹𝗼𝗽𝗺𝗲𝗻𝘁 ➜

Learn how you can create a sticky header in WordPress website ✔️

Let’s say you have a website and you want your header to be always present at top.
You can do this easily by following our 2 simple steps.

So let’s get started!👇

🎬 𝗧𝗮𝗯𝗹𝗲 𝗼𝗳 𝗰𝗼𝗻𝘁𝗲𝗻𝘁𝘀
0:00 Intro
0:41 Install ‘MyStickyMenu’ Plugin
1:35 Make the Header Sticky
2:26 Change the color of the header section
3:43 Make the header sticky for any theme

📌 𝗙𝗼𝗹𝗹𝗼𝘄 𝘁𝗵𝗲𝘀𝗲 𝘀𝗶𝗺𝗽𝗹𝗲 𝘀𝘁𝗲𝗽𝘀

Step 1 : Install ‘MyStickyMenu’ Plugin
Go to WordPress Dashboard ► Plugins ► Add New
Now search for ‘MyStickyMenu’ and click ‘Install’ & ‘Activate’.

Step 2 : Make the Header Sticky
Go to WordPress Dashboard ► myStickymenu ► Sticky menu settings
Now select ‘Primary Menu’ in Sticky class & click ‘Save’.
Next, let’s see how you can change the color of the header section.
Go to WordPress Dashboard ► myStickymenu ► Sticky menu settings
Now, from ‘Sticky Background Color’, choose the color & click ‘Save’.
For some themes on your website, the plugin couldn’t find the header.
So to make the header sticky for those themes,
Go to WordPress Dashboard ► myStickymenu ► Sticky menu settings
Now in ‘Sticky Class’ select ‘Other Class or ID’
Now you need to enter the ID or class of the header.
So to get that, go to your website
Now right-click on the header and click ‘Inspect’.
And you will find the ID and Class of your header.
Now just copy one of those and paste it in the sticky class field.
Make sure you enter ‘#’ if you’re entering ID and ‘. (dot)’ if you’re entering class.
Once you’ve entered ID or Class, click ‘Save’.

This is how you can create a sticky header in WordPress website.

✅ 𝗪𝗲 𝘄𝗶𝗹𝗹 𝗯𝘂𝗶𝗹𝗱 𝗮 𝗽𝗿𝗼𝗳𝗲𝘀𝘀𝗶𝗼𝗻𝗮𝗹 𝗪𝗲𝗯𝘀𝗶𝘁𝗲 𝗳𝗼𝗿 𝘆𝗼𝘂𝗿 𝗕𝘂𝘀𝗶𝗻𝗲𝘀𝘀 ➜

❤️ 𝗢𝘂𝗿 𝗥𝗲𝗰𝗼𝗺𝗺𝗲𝗻𝗱𝗲𝗱 𝗪𝗼𝗿𝗱𝗣𝗿𝗲𝘀𝘀 𝗧𝗼𝗼𝗹𝘀

🔴 🌐 Free Domain + ⚡ Fast Hosting | 𝗪𝗲𝗯𝗦𝗽𝗮𝗰𝗲𝗞𝗶𝘁 |
🔴 🖥️ Ready-made Websites for 🏷️ Sale | 𝗠𝗮𝗸𝗲𝗬𝗼𝘂𝗿𝗪𝗣 |
🔴 🧑💻 Get your website developed by 👨💻 Experts |
🔴 🛠️ Check out our Top recommended 𝗧𝗼𝗼𝗹𝘀 |

🔥 𝗪𝗲𝗯𝘀𝗶𝘁𝗲 𝗚𝘂𝗶𝗱𝗲 – 𝗦𝗶𝗺𝗽𝗹𝗲 & 𝗘𝗮𝘀𝘆 𝗦𝘁𝗲𝗽𝘀 𝘁𝗼 𝗹𝗮𝘂𝗻𝗰𝗵 𝘆𝗼𝘂𝗿 𝗳𝗶𝗿𝘀𝘁 𝗪𝗲𝗯𝘀𝗶𝘁𝗲

🟢 🖥️ Make a Website in 10 mins |
🟢 📰 Make a Blog – Quick & Easy |
🟢 🛍️ Make an Ecommerce site |

🎓 𝗥𝗲𝘀𝗼𝘂𝗿𝗰𝗲𝘀 𝘁𝗼 𝗴𝗲𝘁 𝗯𝗲𝘁𝘁𝗲𝗿 𝗮𝘁 𝗪𝗼𝗿𝗱𝗣𝗿𝗲𝘀𝘀

🔵 🔥 Beginner WordPress Course | 50% Coupon ytSub |
🔵 🛒 Ecommerce Course | SAVE 50% Coupon ytSub |
🔵 📖 Check out our Blog posts for free content |

🎁 𝗖𝗼𝘂𝗽𝗼𝗻𝘀

🟡 🔍 Grammarly|20% off|
🟡 📲 Publer|10% off|
🟡 📈 Mangools |10% off|
🟡 💼 Fiverr|10% off Coupon WEBSITELEARNERS10 |
🟡 🖼️ Astra|10% off Coupon WLDiscount|
🟡 📊 SEMScoop|20% off Coupon SAVE20LT|
🟡 📝Anyword|20 % off Coupon Anyword20|

🙌 𝗢𝗳𝗳𝗶𝗰𝗶𝗮𝗹𝗹𝘆:

𝗪𝗲❜𝗿𝗲 𝗛𝗶𝗿𝗶𝗻𝗴:

Want your website developed by us? Email us your requirements to [email protected]

💬 𝗙𝗼𝗹𝗹𝗼𝘄 & 𝗖𝗵𝗮𝘁 𝘄𝗶𝘁𝗵 𝘂𝘀:

Instagram ➜
Facebook ➜
LinkedIn ➜

Nguồn: https://grenadesandwich.com/

Xem thêm: https://grenadesandwich.com/kinh-nghiem-wordpress/

Tags: ,,,,,,,,,,,

Website Learners

31 Bình luận

  1. Post Issues Here ➜ https://wltalk.com/post/1118042555

    Vote for our next video ➜ https://topics.websitelearners.com/websitelearners

    How to Make Money with your Website ➜ https://websitelearners.com/ebook/top-5-ways-to-monetize-your-website/

    Get the fastest WordPress hosting ➜ https://webspacekit.com

    Checkout our exclusive WordPress course ➜ https://learnwordpress.websitelearners.com/wordpress-course-beginners

  2. Man this guy is the best. makes things so easy and gets to the point. I have no knowledge at all of websites I was forces to have to figure this stuff out on my own. I searched here and there with not much luck searching YouTube going into videos coming out only more confused than I was before ( Not that the other videos were bad not at all ) I was just looking for what resonated with the speed my brain could process things I did not know and then I came across this channel. Building this website and gaining more knowledge has been easier now.

    Thank you for your help and this channel!

  3. Thank you!!! After trying to do this other ways a very simple solution!!

  4. Very well done !!! Thank You

  5. Thank you very much for the help!

  6. Great, thank you for this!

  7. Hi, if the above procedure does not work for you then instead of primary header menu, select "Other Class or ID" and in the field next to it add this #masthead and then adjust the opacity, background colour and save.

  8. It's paid bro

  9. Amazing Tutorial

  10. thanks for the explaining clearly. after click the menu that section/content is going behind the sticky menu. please help

  11. It did not work on my wordpress every time I save, it did nothing to my header. Does anyone know hot to fix this?

  12. Thank you for this, very well done!

  13. thanks bro this what I actually looking for.

  14. Thank you!

  15. 100% helpful!

  16. Even after changing the background colour, it is not showing the changes. I did save it. It only works when i go to html and edit the background colour and make the changes in Additional CSS settings.

  17. Stripe in the top of the website also sticky. I only want to stick the nav menu. How to do this?

  18. I use this plugin with bistro food theme it's working with desktop but not on mobile .. I am much woory pls help me to solve this prob I am big fan of your videos

  19. very helpful video

  20. I kont know why but it doesnt work for me on mobile

  21. Thank you very much! It works!

  22. Why its not working for me?

  23. thank you so much sir. its was really helpful for me.

  24. Thanks it's working great

  25. i have done what you told ,it useless ,sir

  26. My hero.

  27. This plugin has bugs and doesn't work well.

  28. Awesome video . . . thank you!

  29. not working on my site!! what could be the reason behind it??

Trả lời

Email của bạn sẽ không được hiển thị công khai.