How do I hide some CSS classes on some pages in WordPress? Like if I want to hide featured image in blog posts we use:
.single .post-thumbnail {
display:none;
}
I want the class (like .single) for homepage, search page, archives, etc.
You would need to target the page class. If you look at the source code on whatever page you are on, you'll notice the body class include a unique identifier for your page. You can then target that way. See the Codex for a full run-down of page classes.
Home is home, search is search, archives is archive. The homepage won't be single because that's reserved for posts.
You could set custom ones with a filter.
add_filter( 'body_class', 'new_body_class' );
function new_body_class( $classes ) {
if ( is_front_page())
$classes[] = 'custom-class';
return $classes;
Related
Is there a CSS ID for the WooCommerce shop page like there is for single-product etc, so that I can easily target CSS for that page only?
WooCommerce does not add a body class specifically for the main shop page.
post-type-archive-product is probably enough for most cases.
But if you want to specifically style the main shop page instead of all product archives then you can use a filter:
add_filter('body_class', 'add_my_woocommerce_shop_body_class');
function add_my_woocommerce_shop_body_class($classes)
{
if (is_shop()) {
$classes[] = 'my-woocommerce-shop-class';
}
return $classes;
}
You can check for classes in body tag of your shop page. If your theme adds any specific class for shop then you'll find it there else post-type-archive-product class may help.
last days I have been writing my own WordPress theme, but I run into another problem. These times I have no clue, how to make it possible.
I would like to add a class to every frontpage on my website. So if a single page becomes a frontpage, it will get another class to body tag like "home".
Almost every premium theme gots this funcion, but I just cant find the solution.
Does anybody have any idea?
Thank you! Stepan
You can add the class in body tag using body_class filter as shown below:
function home_body_class($classes) {
if ( is_front_page() ) {
$classes[] = 'home';
}
return $classes;
}
add_filter( 'body_class', 'home_body_class' );
You can manipulate the condition for the static homepage, blog page and so on.
I have developed my own wordpress theme, and learning all kinds of programming stuff, but my priority is the content, not the programming knownledge. I need to know how to remove archive date listing from wordpress?
Question 1: The google search results displayed like this: virmodrosti.com/2017/05/
I don't want any kind of date archive option, how do you disable that?
I also don't use any kind of plugin, and always like to do it on my own.
Question 2: I don't know why older entries doesn't work anymore
virmodrosti.com/zdravje/ this page works fine
virmodrosti.com/zdravje/page/2/ it redirects to 404 error page
I only choose option in wordpress to hide that annoying /category/ with dash . inside editor at permanlinks, Category base. Maybe somehow these stuff is kinda fighting with each other and doesn't work properly.
Thank you.
This is code from Digital Nomad theme I maintain:
function digitalnomad_remove_date_archives() {
//if we are on date archive page
if ( is_date() ) {
// theme sets alternatine archive page with table like list of all posts
$archive_page = get_option( 'digitalnomad_archive_page' );
if ( $archive_page ) {
// redirs to alternatine archive page if configured (good for SEO)
wp_redirect( esc_url( get_page_link( $archive_page ) ) );
die();
} else {
// otherwise error 404 is displayed
global $wp_query;
$wp_query->set_404();
}
}
}
add_action( 'template_redirect', 'digitalnomad_remove_date_archives' );
Use the smart Archive Page Remover wordpress plugin
or visit your theme's functions.php file
then insert this code
/* Register template redirect action callback */
add_action('template_redirect','makes_remove_wp_archives');
/* Remove archive*/
function makes_remove_wp_archives(){
// if we are on category or tag or date or author archive
if(is_category()|| is_tag()||is_author()){
global $wp_query;
$wp_query->set_404();
}
}
This is what I need to do:
To target only the main shop page with CSS (a specific custom class I created as mentioned below).
This is what I've done and tried so far:
I have an override template of archive-product.php in my child theme.
In this override template I've added a div with a custom class custom-shop-class just before the product loop start, because I want to target the looped products specifically.
I tried targeting with class page-id-4 because if I hover over the "shop" page in wp-admin, it gave me http://.../post.php?post=4&action=edit
The problem I'm having is as follows:
From what I've discovered is that the same archive-product.php template is being used in the other various shop pages and not only in the main "shop" page (correct me if I'm wrong), so when I target my custom-shop-class with CSS, it affects all the other shop pages using the same template file, and it must not.
There is no unique identifier or class specifically for the shop page, something like the page-id-?? class in the body tag (as in the usual WP pages).
Any suggestions on the best method/solution?
Set a conditional statement to check for the primary shop page, then echo the div in question if that statement evaluates to true.
WooCommerce Conditional Tag for main shop page:
is_shop()
Example
if (is_shop()) {
echo "<div class='custom-shop-class'></div>";
} else {
echo "<div class='custom-product-category-class'></div>";
}
Alternatively:
<?php if (is_shop()):?>
<div class="custom-shop-class"></div>
<?php else: ?>
<div class="custom-product-category-class"></div>
<?php endif;?>
Conditional Tags | WooThemes Documentation
Using the filter body_class with the is_shop conditional you can target the main WooCommerce shop page.
add_filter( 'body_class', 'woo_shop_class' );
// Add WooCommerce Shop Page CSS Class
function woo_shop_class( $classes ) {
if ( is_shop() ) // Set conditional
$classes[] = 'woo-shop'; // Add Class
return $classes;
}
The code goes in your themes functions.php file.
To build on the answer provided here, how might I go further and add a unique identifier to the shop page based on the active WPML language? (I'm basically trying to reduce a font size on the German version of the shop page only - it's proving surprisingly difficult to do)
Currently, by default, the following columns appear in the list of pages in the WordPress admin panel:
Title
Author
Comments
Date
and because I have AIO SEO installed:
SEO Title
SEO Description
SEO Keywords
Is there a way to have WordPress also display the URL to the page (at least the part of the URL that is created when the page itself is created)?
The page url is actually already there by default, it's just hiding. When you hover over a page title, several links appear below the title -- edit, quick edit, trash, view. View is the hyperlink to the page, which you can click to view the page, or right click and copy the link address to use elsewhere.
Otherwise, if you are using a custom/child theme, you could add the following to your functions.php file:
add_filter('manage_page_posts_columns', 'my_custom_column', 10);
add_action('manage_page_posts_custom_column', 'add_my_custom_column', 10, 2);
function my_custom_column($defaults) {
$defaults['url'] = 'URL';
return $defaults;
}
function add_my_custom_column($column_name, $post_id) {
if ($column_name == 'url') {
echo get_permalink( $post_id );
}
}
Note: This just creates a text url to your page.
Also note, you do not want to edit your functions.php file directly if you are using a theme you did not create, as it will be overwritten when you update. If you want to add this to an existing theme, I'd suggest looking into child themes.
This is helpful. I would only improve the output slightly by removing the site url and just showing the page. Takes up less space and less to weed through visually.
if ($column_name == 'url') {
$siteURL=get_site_url($post_id);
$link= get_permalink( $post_id );
echo str_replace($siteURL,"",$link);
}