I want to apply css on the rows in a specific page, but all the pages have the same row-classes.
So I taught its better to add a specific class to the page and then apply the css on it.
I use ACF and I don't know how to add class to this page.
I tried different codes into function.php with no luck.
Exp:
function be_portfolio_archive_body_class( $classes ) {
$classes[] = 'sortiment';
return $classes;
}
add_filter( 'body_class', 'be_portfolio_archive_body_class' );
Related
I'm trying to add a custom CSS class for the search page that uses WooCommerce Product Search.
Search pages path is like:
domain.com/shop/ixwpss=3&title=0&excerpt=0&content=0&categories=0&attributes=0&tags=1&sku=0&v=a3420e5a4c03
When I search for the number 3 that represents the tag for products.
I managed to add the class for the whole shop, with the following function but I want to add only for the search page. Can someone help me?
add_filter( 'body_class', 'add_body_classes' );
function add_body_classes( $classes ) {
global $post;
if ( is_shop() )
$classes[] = 'search';
return $classes;
}
Please update the code like below
add_filter( 'body_class', function( $classes ) {
if ( is_shop() ) {return array_merge( $classes, array( 'class-name' ) );}
}
Assuming that the search page is using the archive-product.php
If you are using a WooCommerce compatible theme then you have to go in your themes folder -> woocommerce and find the archive-product.php. If the override file does not exists then go to wp-content/plugins/woocommerce/templates/archive-product.php
And a if statement to check if is search or not like below:
if ( is_search() ) {
<body class="your-class">
} else {
<body class="regular-class">
// the content that is already in that file (archive-product.php)
}
*if the part (body class in your case) is not there you have to locate it and do the same (probably it's in your header.php)
I am trying to apply specific functions to a certain page ID in Woocommerce.
However, it does not seem to apply. I have looked at both Wordpress and Woommerce conditional tags (https://docs.woocommerce.com/document/conditional-tags/).
The simple code I am testing is shown below, but even that is not working.
if ( is_product()) {
echo ' HALLO sdfdsfsdfsdfsdf ';
}
I have also tried with page_id and post_id but cannot get this to work.
I have added this code to my functions.php in my child theme.
Does anybody know to to write a specific function only for a specific product page (I know the value).
Method - 1
is_page() relies on a complete global $wp_query object. If you call it before the action template_redirect has been fired, it might be impossible to get that data.
add_filter( 'template_include', function( $template ) {
if ( is_product() )
echo 'HELLO';
return $template;
});
Method - 2
The WordPress/WooCommerce conditional tags won’t work until after the wp action is fired, making it the earliest point at which you can use the tags. You can view the entire list, and the order of the core WordPress actions at the Action Reference page.
add_action( 'wp', 'init' );
function init() {
if ( is_shop() ) {
echo 'HELLO, this works!';
}
}
Can you tell me how you can make posts wordpress categories and with different colors?
I want to be the only menu in different colors as well as the category the items!
An example:
check out this site here that you like the color settings are changed as we post categories.
A lot of it depends on how your theme is set up, but here's a general overview:
1. Ensure that you are using the body_class() function
Check you theme's header.php and ensure the body tag looks something like:
<body <?php body_class(); ?>>
This will automatically add a bunch of classes to your body tag, including classes depending on which category archive page you are viewing.
2. Use a filter to add category classes to single posts
Insert the following function into your theme's functions.php file:
function my_body_class_add_categories( $classes ) {
// Only proceed if we're on a single post page
if ( !is_single() )
return $classes;
// Get the categories that are assigned to this post
$post_categories = get_the_category();
// Loop over each category in the $categories array
foreach( $post_categories as $current_category ) {
// Add the current category's slug to the $body_classes array
$classes[] = 'category-' . $current_category->slug;
}
// Finally, return the $body_classes array
return $classes;
}
add_filter( 'body_class', 'my_body_class_add_categories' );
This will also add the category classes to single posts.
3. Add classes for pages
The body_class() function can also be filtered to add classes for page slugs. Add the following to functions.php:
function my_body_class_add_page_slug( $classes ) {
global $post;
if ( isset( $post ) ) {
$classes[] = $post->post_type . '-' . $post->post_name;
}
return $classes;
}
add_filter( 'body_class', 'my_body_class_add_page_slug' );
This will add the class page-title to the body.
4. Style as you please
This will vary according to your theme's markup, but it will be along the lines of:
.td-header-main-menu {
background: blue; // The fallback colour for all pages
}
.category-showbiz .td-header-main-menu {
background: red;
}
.category-sport .td-header-main-menu {
background: yellow;
}
.category-shendetsi .td-header-main-menu,
.page-shendetsi .td-header-main-menu {
background: green;
}
Conclusion
That should give you the general idea; we can't give you more specific instructions without seeing the website itself or know which theme you're using.
My question is, how can i remove the sidebar only for particular Product category "Slug" and not for its child slugs.
If the url is like below - remove the side bar and make the page full width only for slugs "sanitaryware" and "closets"
http://www.example.com/product-category/sanitaryware/
http://www.example.com/product-category/sanitaryware/closets/
I dont want to remove the sidebar for all "Product Category" reason, i want the side bar to show up the grand-child slug"one-piece-closets":
http://www.example.com/product-category/sanitaryware/closets/one-piece-closets
Code: that i am using in function.php - this is removing the side bar in all the product categories of the website.
<?php
/**
* woocommerce_sidebar hook
*
* #hooked woocommerce_get_sidebar - 10
*/
if (!is_product_category('sanitaryware')){
do_action('storefront_sidebar');
}
?>
Based on your desire to hide the sidebar on top-level categories and their immediate children, we will need a system for determining the hierarchical "depth" of any term archive. Similar to how people often get the "top-level" parent term we can do a while loop of getting a term's term object and checking for the term's parent. In our case instead of returning the top-level parent, we'll just keep a count and return that.
/**
* Returns depth level of product category
*
* #param string $catid Product category ID to be checked
* #return string $depth how many categories deep is this term in the hierarchy
*/
function so_32165017_get_product_cat_depth($catid) {
$depth = 0;
while ($catid) {
$cat = get_term_by('id', $catid, 'product_cat'); // get the object for the catid
if( $cat->parent > 0 ){
$depth++;
}
$catid = $cat->parent; // assign parent ID (if exists) to $catid
// the while loop will continue whilst there is a $catid
}
return $depth;
}
Now that we have something we can use as a condition we can conditionally remove the WooCommerce sidebar:
/**
* Hide the sidebar for items 2 levels deep or more
*/
function so_32165017_conditionally_remove_sidebar(){
if( is_product_category()){
$t_id = get_queried_object()->term_id;
if( so_32165017_get_product_cat_depth( $t_id ) < 2 ){
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
// could be theme specific ex: Storefront
remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
}
}
}
add_action( 'woocommerce_before_main_content', 'so_32165017_conditionally_remove_sidebar' );
Edit/Update
If you also want to add a custom body class to make the sidebar-less pages easier to style then I believe you can remove the actions in question from the body_class filter at the same time you are actually filtering the body class.
/**
* Hide the sidebar for items 2 levels deep or more
*/
function so_32165017_conditionally_remove_sidebar( $class ){
if( function_exists('is_product_category') && is_product_category() ){
$t_id = get_queried_object()->term_id;
if( so_32165017_get_product_cat_depth( $t_id ) < 2 ){
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
// could be theme specific ex: Storefront
remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
// add a custom body class
$class[] = 'full-width';
}
}
return $class;
}
add_action( 'body_class', 'so_32165017_conditionally_remove_sidebar' );
One approach would be to make a custom template and prevent the sidebar from rendering if a Product Category page is being viewed. Following the upgrade-safe suggestions from the Woocommerce docs you should:
1) Go to the wp-content/plugins/woocommerce/templates/ directory and copy the archive-product.php file
2) Create a woocommerce directory in your theme directory (e.g. wp-content/themes/your-theme/woocommerce)
3) Create a copy of wp-content/plugins/woocommerce/templates/archive-product.php and put place it in wp-content/themes/your-theme/woocommerce/ and name the file archive-product.php
4) Look near the bottom of your new custom file and find:
do_action( 'woocommerce_sidebar' );
5) Replace that line of code with:
if (!is_product_category('sanitaryware') && !is_product_category('Faucet')) {
do_action( 'woocommerce_sidebar' );
}
6) To make the Product Category page content be full-width you could add a class called product-category to the <body> of these pages using a filter.
To add this new class, insert this code in your functions.php file:
// Add specific CSS class by filter
add_filter( 'body_class', 'product_categories' );
function product_categories( $classes ) {
// add 'class-name' to the $classes array
if (is_product_category('sanitaryware') && is_product_category('Faucet')) {
$classes[] = 'product-category';
}
// return the $classes array
return $classes;
}
7) Then in your theme's stylesheet you could target the Product Category pages using this CSS selector:
body.product-category { /* place Product Category page specific CSS here */ }
Since I don't know the specifics of your theme, I can't tell you the HTML elements you'd want to target to set 100% width to, but if the page content was in something like <div id="content"> you could set the CSS like so:
body.product-category #content {
width: 100%;
float: none;
}
You can remove the sidebar from category page override archive-product.php or use action hook in function.php in your current theme in WordPress.
Instead of editing these files directly within the plugin (which is a very bad idea because once update the plugin and all of your changes will be lost!), you can copy them into your theme:
In your theme directory, make a new folder called “WooCommerce.”
Navigate to the WooCommerce plugin directory and open the "templates" folder. The templates folder has a lot of subfolders with all of the different templates that WooCommerce uses. Fortunately, the template file structure and naming in WooCommerce is easy to follow.
In your newly created "WooCommerce" folder, copy the template file that you want to edit.
Remember to keep the directory structure the same here. If the
template you want to edit is within a subfolder then remember to
create that subfolder within your theme's directory.
In archive-product.php -
<?php
/**
* woocommerce_sidebar hook
*
* #hooked woocommerce_get_sidebar - 10
*/
do_action('woocommerce_sidebar');?>
this code display sidebar on category page remove this code and save file .
or
To remove sidebar from category page you want to use action hook in
function.php file -
add_filter( 'body_class', 'remove_sidebar' );
function remove_sidebar()
{
if( is_product_category()) {
remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10);
}
}
Next, we have to edit the style.css in your theme folder-
body.product-category #content
{
width: 100%;
}
Here you can get WooCommerce Action and Filter Hook
-https://docs.woothemes.com/wc-apidocs/hook-docs.html
I would like to setup different META syntax on my Wordpress website, depending on the template I use (5 templates for pages and 8 templates for articles.
I use SEO by yoast that only gives the possibility to add ONE META syntax for all pages oand one for ALL articles.
I tried add use this on my function.php for one template (example)
$pref_nom = get_post_meta($post->ID, $pref_nom, true);
function prefecture_filter_wp_title( $title ) {
if ( is_page_template( 'pages-prefectures.php' ) ) {
return $pref_nom;
}
return $title;
}
add_filter( 'wp_title', 'prefecture_filter_wp_title' );
But I doesn't work (notice that $pref_nom is not declared)
What's wrong ?
Thanks in advance for your help.