wpvidZ

Learn WordPress With Video Tutorials

  • Blog
  • Browse
    • Backup & Restore
    • WordPress Localhost
    • WordPress Hosting
    • WordPress themes
    • Version Updates
    • Plugin Tips
    • Security
    • Tutorials
    • WordPress SEO
    • WP Miscellaneous
    • Sitemap
  • WP 5+ Tutorial
  • Search
wpvidZ Blog Tutorials Highlight current page wordpress

Tutorials

Highlight current page wordpress

Last updated on February 18, 2017
Posted on December 25, 2010

Highlight current page wordpress nav bar menu.

Highlight current page wordpress navigation is made for the purpose, that people who visit our blogs notice the different colors of the navigation tab, so it is easier to spot which page they are currently viewing.

Some wordpress bloggers even give a fix different menu background color for a specific page. You can see my “free services” menu tab in this blog, which is always highlighted with black background.

The reason is simply to catch visitor’s attention, that in that page, contains something different and special content compared with the post or pages in the whole blog.

Basically, if you highlight current page wordpress, you give your site ability to be more user friendly because it is offering them to see a highlighted menu tab if they select a specific or particular page.

Highlight current page wordpress, editing files.

When you want to highlight current page in wordpress, you need to know a little bit of programming language, which are mostly html, php and css. (see more in wordpress editing css file tutorial post).

You can also edit the php files, which to me, is more complicated than editing css file.

To modify the stylesheet file is the easiest way and more fast solution if you need to highlight current page wordpress, especially if you work with default theme.

If you use another theme, it is also not hard since wordpress 2.9+ supports classes to highlight current page wordpress. ( i used wordpress for the first time with wordpress 2.9.2, so i am not familiar with the older version).

In wordpress older version, as far as i know, you need to edit the php files of your theme to achive highlighted tab of your blog, but then the newer wordpress version allows us to specify the id and classes in css file to highlight current page wordpress.

highlight current page wordpress
Highlight current page wordpress demo on this blog.
  • Is my site loading fast? I use this shared hosting
  • Try my theme >

Highlight current page wordpress video tutorials.

Eventhough it is my personal habit to check my wordpress blog w3c validator, i still recommend that you also do it whenever you modify your theme files, including to highlight current page wordpress.

Also very important to check how your blog looks in different browser, especially ie (Internet Explorer) and other browsers as well to see if you are successfully aply the css modification to highlight current page wordpress .

Another recommendation, which i am also currently using is to try Thesis theme, you do not have to edit any files, you just need to open theme option, choose color, and save. If you have any problem in this with Thesis theme feel free to contact me.

1. Almost one year ago, i have posted a video, how to highlight current page wordpress 2.9.2, which is titled, styling active button wordpess.

The method to  highlight current page wordpress is still the same, as well as the code, so feel free to check if you want to highlight current page of your wordpress blog.

If you like, you can modify the hover attribute too by giving a:hover in css file.

2. Another video tutorial that can be reference for this, is changing TwentyTen background menu color tutorial.

You can also try to implement these code to apply on special page or category.

li.current_page_item — to highlight the current page if an individual selects it.
li.current_page_parent — to highlight parent of the current page
li.current_page_ancestor — to highlight the ancestor of the current page

With those both videos above, you should be able to modify and highlight current page wordpress.

Highlight current page wordpress nav bar menu.

Highlight current page wordpress navigation is made for the purpose, that people who visit our blogs notice the different colour of the navigation tab, so it is easier to spot which page they are currently viewing.

Some wordpress bloggers even give a fix different menu background color for a specific page. You can see my “free services” menu tab in this blog, which is always highlighted with black background.

The reason is simply to catch visitor’s attention, that in that page, contains something different and special content compared with the post or pages in the whole blog.

Basically, if you highlight current page wordpress, you give your site ability to be more user friendly because it is offering them to see a highlighted menu tab if they select a specific or particular page.

highlight current page wordpress, editing files.

When you want to highlight current page in wordpress, you need to know a little bit of programming language, which are mostly html, php and css. (see more in wordpress editing css file tutorial post).

You can also edit the php files, which to me, is more complicated than editing css file.

To modify the stylesheet file is the easiest way and more fast solution, especially if you work with default theme.

If you use another theme, it is also not hard since wordpress 2.9+ supports classes to have current page highlighted. ( i used wordpress for the first time with wordpress 2.9.2, so i am not familiar with the older version).

In wordpress older version, as far as i know, you need to edit the php files of your theme to achive highlighted tab of your blog, but then the newer wordpress version allows us to specify the id and classes in css file to highlight current page wordpress.

Highlight current page wordpress video tutorial.

1. Almost one year ago, i have posted a video, how to highlight current page wordpress 2.9.2, which is titled, styling active button wordpess.

The method is still the same, as well as the code, so feel free to check if you want to highlight current page of your wordpress blog.

If you like, you can modify the hover attribute too by giving a:hover in css file.

2. Another video tutorial that can be reference for this, is changing TwentyTen background menu color tutorial.

You can also try to implement these code to apply on special page or category.

li.current_page_item highlight the current page if an individual selects it.
li.current_page_parent highlight parent of the current page

li.current_page_ancestor highlight the ancestor of the current page

With those both videos above, you should be able to modify and highlight current page wordpress.

button current highlight menu Wordpress

Latest Posts

  • Twenty Nineteen Theme Full Tutorial – Creating a Website
  • Uninstall W3 Total Cache Plugin – Incredibly Easy!
  • Create WordPress Website 2018 on SiteGround Genesis
  • WordPress Noopener Noreferrer Rel Attribute Quick Fix
  • WordPress CDN Setup with MaxCDN and W3 Total Cache Plugin
  • Twenty Seventeen One Page Parallax Scrolling Website Style
  • How To Add Google Map in WordPress Contact Page
  • WordPress 4.7 Justify Text and Underline
  • Twenty Seventeen Footer “Proudly Powered By WordPress” Text
  • How To Add YouTube Subscribe Button To WordPress Website
← WordPress internal server error [How to fix]
→ Autoblog theme (Best Choice)

Comment form on this post is closed after 60 days.

Search

Worth Reading

  • WordPress CDN setupWordPress CDN Setup with MaxCDN and W3 Total Cache Plugin
  • WordPress Google maps in contact pageHow To Add Google Map in WordPress Contact Page
  • The configuration of YouTube Subscribe button in Google Developers web pageHow To Add YouTube Subscribe Button To WordPress Website
  • Adding Social Media Links to WordPress Menu With CSS Classes
  • Unable to create directory wp-content/uploads in WordPress
  • Forward Twitter to Facebook Using App and Feedburner Tutorial
  • Kitchen Sink WordPress - Seem Simple But Important
  • Admin Pointers, Drag and Drop WordPress 3.3 Media Upload Features
  • How to sell ebook in a wordpress blog?
  • Check your site's performance using Google labs Page Speed

Backup & Restore

Backup WordPress Without a Plugin or FTP

Export WordPress Database using phpMyAdmin

BigDump Alternative – When BigDump Failed Importing Large WP Database

At This Place The Current Query Includes More Than 300 Dump Lines

View All..

Live Online Website

View All..

Offline Installation

How to Upload WordPress localhost to live server manually

Steps to Install WordPress on Windows 8 and WAMP 2.4

Install WordPress on Mavericks OS X 2014

Maximum upload file size in WAMP WordPress

View All..


WPvidz Hosting Image

  • About Me
  • Contact
  • Affiliate Disclosure
  • Privacy Policy
  • Term of Use

Copyright© 2023 wpvidz.com SG2021 | sitemap.xml


WPvidz.com is independent from WordPress.org but is proudly powered by WordPress & its block-based editor (Gutenberg)

WpvidZ.com uses cookies" to give you the best browsing experience possible. If you click "I Accept" below then you are consenting to this. For more information about your privacy settings on this website, please visit the Privacy Policy page. I Accept