Using WordPress. My header navigation includes pages that link to categories. For instance, the 'about' in the header navigation is a page but it links to a category called 'about'. On this page, I have the page title displaying and then the post with the 'about' category is also displayed on this page.
When I try to remove the page title ('About') it removes that title AND the post's title on that page.
Ex. I am able to modify the pages with: (.category-21 is the ID for the about page)
.category-21,
.category-22,
.category-23 {
color: blue;
}
But when I try to remove the page title with:
.category-21 h2,
.category-22 h2,
.category-23 h2 {
display: none;
}
It removes the page title AND the post's title.
The problem is that the header 2 modifies both titles.
How do I separate the two?
What would I add/modify to functions.php (or single.php?) and to style.css?
I'm also using this to exclude posts with the category of 'about' (and two others):
function excludeCat($query) {
if ( $query->is_home ) {
$query->set('cat', '-21, -22, -23');
}
return $query;
}
add_filter('pre_get_posts', 'excludeCat');
I think it's also excluding these categories from certain style changes in style.css (if that helps).
.category-23 h2:nth-child(2)
OR
.category-23 h2:last-child
OR
Add a class to another h2 and then change the style of it.
Related
I'm attempting to remove or prevent the from being added to is_paged() taxonomy pages (tag and category pages).
I'm not sure if it is possible to remove, however is it possible to set a condition that this class is only added is the page is NOT is_paged(). This will prevent the class="clr tax-desc" from being displayed on page 2, page 3, page 4, etc of my category and tag pages.
I only want the class="clr tax-desc" to be present on the main page (or page 1) of the relevant category and tag pages.
I need to create something along the lines of:
if ( is_archive() && !is_paged()) {
Remove <div class="clr tax-desc"></div>
}
Any suggestions on how to go about this?
If not mistaken, does the description under the category name have the class entry-meta?
If you give this class in your css the property
display:none;
then it will be hidden from your pages.
So add this line into your css and it should be gone.
.entry-meta { display:none; }
I am trying to hide the header on a specific page in WordPress. I know that I can do this using CSS.
The page id as displayed in the dashboard is:
wp-admin/post.php?post=31221&action=edit
The page has a header without an id or class (not sure who built it). But I can hide the header with:
header {display: none;}
I can't seem to hide the header on the specific page. I have tried:
.page-id-31221 header {display:none;}
.pageid-31221 header {display:none;}
I have also tried the same with # and postid etc etc. Is there another way to hide the header on that page?
Failing that is there a way I can hide the header after it has been called in the template? I have created a custom template for the page but im not sure of the php to use to hide it. If I remove <?php get_header();?> from the template then the whole page disapears.
The website is here: Website
You say you have created a template for this specific page.
In which case you can use jQuery to hide the header. Add this to the end (or start) of your page template.
<script>jQuery('header').hide();</script>
You would probably want to wrap this inside something like a jQuery( document ).ready(function() { to ensure the page is loaded before the script is run. Maybe add in the defer attribute too.
You can modify your header.php by adding an IF-statement which checks for the required pages by either the page/post ID or title.
Page/Post ID method:
if(is_page(get_the_ID()) != YOUR_PAGE_ID) { // show header }
Page/Post Title method:
if(!is_page(get_the_ID('PAGE_POST_TITLE'))) { // show header }
Either of these methods should work. *Not tested.
You can do this by checking the page name.
if( is_page( array( 'about-us', 'contact', 'management' ) ){ #hide your header; }
If you want more details please read the wordpress official documentation. It will helpful for you.
Read wordpress official documentation
This works for me. A simple trick:
Check your style class name in your header.php in the top example: class="header">
And place this code in the top from your php template or page.
<head>
<style>
.header { display: none; }
</style>
</head>
<body>
Guys I'm having an issue with the home page title of my wordpress blog after i updated the wordpress to 4.4. I'm not sure if its because of the update. The issue is, I'm getting "Home" prefix for the home page title. Here's my website - www.autodevot.com
In the wordpress Settings > General, in the Site Title section, I've written Autodevot. And in the Tagline section, I've written Automotive World News | Car News and Reviews | Upcoming Cars in India. So earlier, this tagline section was appearing in the home page title. Now for some reason, Its adding "Home" prefix for the home page title. So now the title comes as Home - Autodevot. I need to get rid of that "Home" and want the tagline section to appear in the title like before. Title for rest of the pages are appearing fine. Problem is only with the home page title. I opened the header.php and the code is like this
<?php
if ( ! function_exists( '_wp_render_title_tag' ) ) {
function theme_slug_render_title() {
?>
<title><?php wp_title( '|', true, 'right' ); ?></title>
<?php
}
add_action( 'wp_head', 'theme_slug_render_title' );
}
?>
Any help?
Many sources on this topic points to eithe using a plugin or changing some PHP code. However, a newer feature (WordPress 4.7) allows adding custom CSS to a theme (which is bound to that theme, but is not overwritten at theme updates). This saves the need to create a child theme. This tool is accessed through the "Additional CSS" tab in theme customization.
Taking inspiration from this blog post about how to select the page title in CSS, I've added:
.home .entry-title {display: none;}
to hide the h1 title "Home" on my home page. I suspect that the home class is generic for all front pages (no matter the actual title of the home page).
As an alternative, to remove the title on all pages (but not blog posts):
.page .entry-title {display: none;}
Finally, as explained in the blog post, it is possible to target a specific page with its id:
.page-id-177 .entry-title {display: none;}
where page-id-177 comes from the class attribute of the <body> tag of the page of interest.
Thanks to the live preview, it's easy to see if the CSS is effective!
replace your code with this code
<?php
if ( ! function_exists( '_wp_render_title_tag' ) && !is_home() || !is_front_page() ) {
function theme_slug_render_title() {
?>
<title><?php wp_title( '|', true, 'right' ); ?></title>
<?php
}
add_action( 'wp_head', 'theme_slug_render_title' );
}
?>
You can try this one, Just add your theme functions.php
add_filter('wp_title', 'filter_pagetitle');
function filter_pagetitle($title) {
global $wp_query;
if (is_front_page()){
return $wp_query->post->post_title;
}
}
just change the file name as one of your keyword. For wordpress, change the page title to your keywords.
I did it and works fine now.
I found this one Remove breadcrumbs if "home" in wordpress
but sadly not working for me
<body<?php if(! is_home()) echo ' id="homepage"';?>>
in header.php
body#homepage#breadcrumbs {visibility: hidden;}
and added in style.css
First change your css to this. Because Breadcrumb Trail uses a class of breadcrumbs and not an id.
body#homepage .breadcrumbs
Have you tried using is_frontpage() instead of is_home() ?
Do you realize that at the moment you are adding homepage id to all pages which are not the "home" page? Don't use the ! in your if.
<body<?php if(is_frontpage()) echo ' id="homepage"';?>>
blog postspage = frontpage
On the site front page:
is_front_page() will return TRUE
is_home() will return TRUE
static page = frontpage
On the page assigned to display the site front page:
is_front_page() will return TRUE
is_home() will return FALSE
On the page assigned to display the blog posts index:
is_front_page() will return FALSE
is_home() will return TRUE
Try separating the #breadcrumbs.
In the CSS:
body#homepage #breadcrumbs {visibility: hidden;}
The code you posted refers to a body element with an ID breadcrumbs. What you need to target is an element with #breadcrumbs ID, that is inside a body with #homepage ID.
Also, the body has .home class in Wordpress by default.
So you can achieve it without the PHP part.
body.home #breadcrumbs{display:none;}
There is another way to do it using body_class()
<body <?php body_class(); ?>>
And then in the css if it's home page you can use
body.home #breadcrumbs { visibility: hidden; }
You can either use the if condition with home page id.
CSS Update - it's .breadcrumbs not #breadcrumbs:
body#homepage .breadcrumbs { visibility: hidden; }
PHP:
<body<?php if(is_home()) echo ' id="homepage"';?>>
In your header.php code, the ! means NOT, therefore you're saying:
if NOT homepage, add id "homepage"
Which is the opposite of what you want.
Also note that visibility:hidden will hide the element but preserve its space in the layout.. if you want to hide the element and its space you can use display:none instead.
As #Eric-Mitijans explained, you have to add a space between body#homepage and #breadcrumbs otherwise you'd target a body tag with 2 IDs which is incorrect syntax.
I want to hide the top slider part from the blog pages but in the first blog page I want to keep it. You can check this link: http://site4preview.site90.net/wordpress/ . There are two pages in the page navigation. I want to hide the slider from all pages starting from the page number 2 except 1. So is there any way to do it please ? Thanks in advance.
You need to check if that page is a "pagination" page, for this you must use is_paged().
Try this.
<?php
if( !is_paged() ) {
//Slider Goes Here
}
?>
EDIT:
You could just hide with CSS, it's not the best solution, but it get the job done.
If you have multiple sliders you could use this cascade to be more precise
.paged .block-content .widget-area .recent-posts-flexslider-class {
display: none
}
just hide all sliders under the paged pages
.paged .recent-posts-flexslider-class {
display: none;
}
or, if you know CSS hide the div you want utilizing the class .paged that shows only when you're visualizing a paged template