Adding 'active' class to wp_nav_menu when viewing post - php

I have a Wordpress site comprised mostly of pages, but there is one page (news section) that contains posts and categories like a blog would. I'm generating my nav using wp_nav_menu() with only the top-level pages displayed. I have styles set for the current link and the current link's parent that use the .current-menu-item and .current-page-ancestor classes that wp_nav_menu() automatically adds.
However, when you're viewing a post within the news section, no classes are added to the nav to indicate that you're in that section, and there's no way to style the "news" link to show that it's the section of the site the user is in.
Is there a way for WP to "know" that posts belong to that page? It's not a category because since no other sections of the site contain posts, the categories field is open and the editors can add whatever categories they want.

Do you have your "News" page set as your blog page, in the "Reading" settings? If so, it should add the class "current-menu-parent" and "current-post-parent" to the "News" <li> when you are viewing a post.

According to Wordpress template hierarchy (and specifically this diagram) a single post is being displayed by a file called single.php (or single-<post_type>.php. A set of posts from a category will be displayed by category-<post_type>.php template file.
Now, if you abide to this hierarchy, you'll have two more templates - news list and news detail page. Having two pages with these templates will make them automatically listed by Wordpress menu-generating function.
If that's not enough for you, you should use WP_Query to manually list your pages. If you decide to do it this way, one or two if statements should do the job.

Related

Populating a WordPress Page with posts from a Category or Tag

I have a WordPress for my science journalism blog and I would like to add a page that contains a subset of the blog posts. For example, having a page populated by a certain category (i.e. review articles) or tags (i.e. physics).
There seems to be a way to do this by making a new php page, but I am not sure how to get to a blank template to add the code base.
Alternatively, I would prefer having a way to do this without having to mess with the code at all. Any help would be much appreciated. Thanks!
This happens automatically with WordPress; read the docs:
When a viewer clicks on a link to one of the Categories on your site,
he or she is taken to a page listing the Posts in that particular
Category in chronological order, from newest Posts at the top to
oldest at the bottom.
Read https://codex.wordpress.org/Category_Templates
You don't have to make a category or tag template page, but you can if you want to. This is theme-dependent; your theme may already have different archive page templates.
The URL for a category or tag archive page will be:
example.net/category_base/category_name
example.net/tag_base/tag_name
Read https://codex.wordpress.org/Using_Permalinks#Category_base_and_Tag_base
Go to Appearance>Settings>Reading to set number of posts per page and either excerpt or full post.
I think you should be able to get at a category by going to http://example.com/category/mycategory
And to tags by visiting http://example.com/tag/mytag
You should be able to add categories to the main menu, and add tag pages via a custom link OR use a tag cloud?
Hope this helps.

How to colour wordpress menu lis based on category assigned to each page?

I would like to create a nav menu that displays all the pages of a wordpress site, its layout similar to what you would see in a footer sitemap layout, approx 5 columns with all the pages shown. Each page will be a project. I want to use wordpress category checkboxes (like you have for posts) to allow selection of one relevant category for each project page. Each page will then show a category caption below the project's description text, this I will style with CSS so each category has a different background colour.
Because Wordpress doesn't provide categories for pages, I have found a plugin to add this category feature to pages called ninja-page-categories-and-tags: http://wordpress.org/extend/plugins/ninja-page-categories-and-tags/
It's possible to edit the plugin php code under basic-functions.php to return a 'class' for the category displayed using get_slug and then applying css for each.
My problem is that on the menu, which will be a secondary menu in Thirty Ten displaying the pages, I want to be able to colour the background of each link to match the category that has previously been assigned to each page using the ninja plugin. Because the menu works with pages and the categories are not directly linked to the menu items (firebug will not show category details in the html of each link to reference with the css) I am wondering how I can colour each link based on category? Any ideas?
Ultimately what I would like to achieve is a grid of page links that are all coloured based on their category, a colour coded menu.
The plugin uses the standard wordpress category functionality but I just can't think how to connect these category details to the menu items to allow me to style them with css, any help would be really appreciated, even if just a point in the right direction.
Thanks
It's difficult to understand exactly what you're after, but essentially if you want to add extra classes to menu items (which will allow styling), you need to create a custom walker function.
Have a look at a tutorial like this: http://wp.tutsplus.com/tutorials/creative-coding/understanding-the-walker-class/

How can my website show only links of posts in wordpress and one feature article?

I looked in documentation but have no clue. My goal is that the main div should contain a featured post I choose and under a set of catgeories in a div, it should display links to posts that include a certain tag. HELP?
You can create a custom page template that outputs the posts as you described using custom queries, create a page that uses this template, then set your site's home page to be this page.

Using WordPress as a CMS

I am currently teaching myself WordPress and working on my own CMS site.
My site will consist of approximately five pages where the header/sidebar menu/footer will be seen on all these five pages.
Beginner here and questions are as follows:
All these five pages will consist of different content, for example, every page will have a image banner representing the menu option just clicked, for example, "About Us" on page 5, "Promotions" on page 4 etc and then some text beneath that and then possibly some images inside a carousel set up.
Within WordPress, how would I tackle this, i.e. do I just create a page in WordPress, position the banner image at the top of the page, then have a few breaks and then insert the carousel of images - is this correct?
If not, do I need to create a separate php file called aboutUs.php that has this markup and then somehow link it to a WordPress page?
On my landing page of my site ONLY (page 1), just above the footer, I want to display a div section that displays all the sponsors of the website along with a URL to click to their websites - how would I go about doing this in WordPress?
Furthermore, with my menu, how do I link my menus to point to the WordPress pages relating to that menu option?
If you use the 'default' template that comes with WordPress you could do something like this to generate different content on different pages without creating separate php files (this would go in page.php):
<?php if(is_page('About Us')) { ?>
<?php $about_query = new WP_Query('category_name=aboutus-&showposts=1');
while ($about_query->have_posts()) : $about_query->the_post(); ?>
<?php the_content();?>
<?php endwhile;?>
Essentially, in this you could just create a post and an 'aboutus' category to reference it. The page of 'About Us' (referenced through is_page()) would contain the content you wanted to display.
First, some background. Wordpress has a number of ways to display stuff, such as images, text, and query results; here's a list:
THEMES
You can modify your theme files directly to do whatever you like. This will probably involve learning a lot about PHP and the Wordpress internals, but there are plenty of books, and the Wordpress Codex to help you. You can get themes from the Wordpress theme directory.
PLUGINS
There are huge numbers of Wordpress plugins, any one of which might fit your need. Plugins will require configuration, but generally won't involve learning PHP -- just how to install and configure them. Most of the SEO (Search Engine Optimization) plugins will allow you to place custom HTML in the templates (nominally for ad placement, but you can do anything you want with it). You can get plugins from the Wordpress plugin directory.
WIDGETS
The base Wordpress software and many plugins provide Widgets. A widget is a display element that can be docked in one or more widget areas. Typically a widget will be a chunk of HTML (often an unordered list) that has the theme's style sheet applied. Widgets are often used for ad placement, navigation elements (menus, dropdowns, breadcrumbs) or to provide tag clouds, category lists, calendars, etc.
SHORTCODE
A shortcode is a macro that can be placed in a page or post, that will return a chunk of HTML. Shortcodes can take parameters that will affect what the shortcode returns. The base Wordpress software provides some shortcodes, but many plugins will provide shortcodes as a way to get more functionality without the need for widgets or theme modifications.
With all of that in mind, here's my answer(s) to your question(s):
Modify your theme to include a page template, and add your image selection code to the template. Then create your individual pages, and then select your template while editing the page.
The 'landing page' can be any page (instead of the default blog index page); create a 'home' page and a 'home' page template that includes your advertisements. Alternately, use a SEO plugin to add the ads above the footer.
I don't know what theme or plugins you use, but generally you can configure a navigation menu to work from a list of pages, specifying either which pages to include or which pages to exclude. If your theme doesn't include this functionality, I'd recommend choosing a different theme.
Look into Wordpress "page templates". The Wordpress codex can help you understand this.
If you edit a post in WP you will notice the option to use a template. That is your goal. Learn how to work with them.
Wordpress themes are composed of multiple files. One of them is the header.php file which contains the header content. The footer.php file contains the footer and the sidebar.php contains the sidebar. These are the usual conventions. They're not strict. There will be a couple of main files which include these (e.g., index.php - Used for articles, page.php - Used to display pages etc.)
If I were making a setup like yours, I'd make five "pages" (using the backend) and then customise my page.php file to present it properly. I'd still keep the header, footer and sidebar separate from the page.php file since they'd be there for pages like 404s etc. as well.
Just put something in the content of the landing page to display this.
IF you're doing theme development, the right place to look at is http://codex.wordpress.org/Theme_Development

Custom URL rewrite in wordpress

I am trying to achieve a custom URL structure with Wordpress. Basically, my site functions as my blog and my portfolio. I want to have an "Articles" section and a "Portfolio" section. I want the articles to display on the Articles page, and the portfolio on the Portfolio page. Should be easy, except on top of that I want custom URLs...
I want the URLs setup like this:
Articles page:
http://mydomain.com/discusses
Specific article:
http://mydomain.com/discussed/%postname%
Portfolio page:
http://mydomain.com/does
Specific design:
http://mydomain.com/designed/%postname%
I can figure out how to do only one rewrite of this type, but WP doesn't have built in functionality to do both. I'm just wondering where I should start or what I should do...
The problem also becomes, I want to retain category functionality in both areas, so maybe it needs to be achieved with Custom Fields? and add a new rewrite rule based on the custom field of a post? I have idea where to start...
Thanks for any help you can give.
This actually isn't that hard to do. I'll go down, page by page, what you would need to do to achieve this.
Articles Page
Create a new template in your theme folder (/wp-content/themes/your-theme/) called discusses.php and just add the following content:
<?php
/*
Template Name: Discusses Template
*/
?>
You don't need any more content. Go into the Pages section of WordPress Admin and create a new page called Articles page and set the URL to be /discusses/. Set the template of this page to be Discusses Template. Now, go into the Settings → Reading section in Admin and set the Posts page to Articles page. Now all your blog posts will appear under the URL /discusses/
Specific Article
The easiest way to have all your articles appearing as /discussed/title is to rename the default category (in Posts → Categories) to discussed. Then set your permalinks to be:
/%category%/%postname%/
This will render the links you need for each post.
Portfolio Page & Specific Design Page
Assuming this will be some kind of custom design, the easiest thing to do would be to create a custom template and Page in the pages section, as you did for the articles page, and throw your custom HTML and CSS into that. I would then set each specific design page to be a child page of that in the pages section. You can use the WPdb classs to make custom queries to populate the Portfolio page.

Categories