"hide" element when if-statement is true (similar to if > then) - php

I have this code that adds a custom field to my products in woocommerce:
add_action( 'woocommerce_single_product_summary', 'shoptimizer_custom_author_field', 3 );
function shoptimizer_custom_author_field() { ?>
<?php if(get_field('author')) { ?>
<div class="cg-author"><?php the_field('author'); ?></div>
<?php }
}
Now I would want to add a condition to the if-statement that says "if field is not empty, hide product title".
The class for the product page product title seems to be "product_title".
Will be fascinating how this will look like once It's added into this piece of code above. I think it's not a big deal, but my comprehension ends with HTML and CSS sadly.

I'm not sure if I understand your question correctly, but if you want to hide the product title if the custom field is not empty, you can use the following code:
add_action('woocommerce_single_product_summary', 'shoptimizer_custom_author_field', 3);
function shoptimizer_custom_author_field() {
if (get_field('author')) {
echo '<style>.product_title { display: none; }</style>';
}
}
If you want to hide the product title if the custom field is empty, you can use the following code:
add_action('woocommerce_single_product_summary', 'shoptimizer_custom_author_field', 3);
function shoptimizer_custom_author_field() {
if ( ! get_field('author')) {
echo '<style>.product_title { display: none; }</style>';
}
}

Just to conclude this thread, below anybody that seeks a similar answer can copy and paste the solution that worked for me:
add_action( 'wp_head', function() {
?><style>
h1.product_title.entry-title {
display: none;
}
.cg-title h1.product_title.entry-title {
display: block !important;
}
}</style><?php
} );
add_action( 'woocommerce_single_product_summary', 'shoptimizer_custom_author_field', 3 );
function shoptimizer_custom_author_field() { ?>
<?php if(get_field('author')) { ?>
<div class="cg-author"><h1><?php the_field('author'); ?></h1></div>
<?php }
else {?>
<div class="cg-title"><?php woocommerce_template_single_title(); ?> </div>
<?php
}
}

Related

Product tab heading not showing

trust y'all good. I have an issue with woocommerce product tab heading(title) not showing. I have tried function.php via a child theme and CSS but none seem working. These I have tried
function.php
add_action( ‘after_setup_theme’, ‘cg_add_desc_tab_title’, 99 );
function cg_add_desc_tab_title() {
remove_filter( ‘woocommerce_product_description_heading’, ‘__return_null’ );
}
CSS.
.panel.woocommerce-Tabs-panel–additional_information h2:first-of-type,
.panel.woocommerce-Tabs-panel–reviews h2:first-of-type {
display: block;
}
Any help is appreciated.
add_action( ‘after_setup_theme’, ‘cg_add_desc_tab_title’, 99 );
function cg_add_desc_tab_title() {
remove_filter( ‘woocommerce_product_description_heading’, ‘__return_null’ );
}
CSS.
.panel.woocommerce-Tabs-panel–additional_information h2:first-of-type,
.panel.woocommerce-Tabs-panel–reviews h2:first-of-type {
display: block;
}

php function to change css

I'm trying to add a piece of code to change css on a page. I added the code to functions.php in WordPress. However, it does not seem to work. Since I'm quite new to this there might be something quite basic wrong with the code... Any idea why it might not be working?
// This code is added to functions.php
// intro is the class name of the element I'm trying to change
add_action( 'intro', function () {
if ( is_user_logged_in() ) {
?>
<style>
display: none!important;
</style>
<?php
};
exit;
});
I got it to work by removing exit; and targeting an element:
add_action( 'wp_head', function () {
if ( is_user_logged_in() ) {
?>
<style>
.intro{
display: none!important;
}
</style>
<?php
};
});
I think what you are trying to do is change the content of the css class which I do not think you can do. Instead a solution would be to assign a css class with the propertied that you want applied to the element e.g.
<div class="<?php if ( is_user_logged_in() ) { echo 'intro';} ?>">
// Whatever you have here will get the css style applied
// if user is logged in
</div>
And inn The CSS you have the following
.intro{
display: none!important;
}
You can create multiple files for different styles e.g. another class
.outro{
display:initial;
}
And you can add it in the code as
<div class="<?php if ( is_user_logged_in() ) { echo 'intro';} else{ echo 'outro';} ?>">
// Whatever you have here will get the css style applied
// if user is logged in and if logged out then outro class will be applied
</div>

Apply CSS Rule to woocommerce Product BACKEND page

We try to apply a certain css rule to a product backend page not the frontend page.
But there are 2 types of pages one which is when you click create product and one when you click edit product.
We need to apply the css rule to both of these pages.
We achieved half of the answer by determining part of url when we click add product in the backend by the solution below:
add_action( 'init', 'bbloomer_apply_css_if_url_contains_string' );
function bbloomer_apply_css_if_url_contains_string() {
$url = $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];
if(false !== strpos( $url, 'post_type=product' )){
echo '<style type="text/css">
#ovaem_sectionid { display: none !important }
</style>';
}
}
We hope if there is a thing like (is_Product) but for the backend can be used for both when adding a new product or when editing an existing product page to apply this css.
<body> contains .post-type-product class, use it as the first selector
function my_custom_css() {
echo '<style>
.post-type-product #ovaem_sectionid {
display: none !important;
}
</style>';
}
add_action('admin_head', 'my_custom_css' );

Remove CSS of WordPress admin bar

In a WordPress blog I want to disable admin/logged users topbar.
add_action('get_header', 'remove_admin_login_header');
function remove_admin_login_header() {
remove_action('wp_head', '_admin_bar_bump_cb');
}
add_action('after_setup_theme', 'remove_admin_bar');
function remove_admin_bar() {
show_admin_bar(false);
}
The code above removes the admin bar but it still prints the following CSS and I need to remove it because it is useless.
<style type='text/css'>#wp-admin-bar-ai-toolbar-settings .ab-icon:before{content:'\f111';top:2px;color:rgba(240,245,250,.6)!important;}#wp-admin-bar-ai-toolbar-settings-default .ab-icon:before{top:0px;}#wp-admin-bar-ai-toolbar-settings .ab-icon.on:before{color:#00f200!important;}#wp-admin-bar-ai-toolbar-settings-default li,#wp-admin-bar-ai-toolbar-settings-default a,#wp-admin-bar-ai-toolbar-settings-default li:hover,#wp-admin-bar-ai-toolbar-settings-default a:hover{border:1px solid transparent;}#wp-admin-bar-ai-toolbar-blocks .ab-icon:before{content:'\f135';}#wp-admin-bar-ai-toolbar-positions .ab-icon:before{content:'\f207';}#wp-admin-bar-ai-toolbar-positions-default .ab-icon:before{content:'\f522';}#wp-admin-bar-ai-toolbar-tags .ab-icon:before{content:'\f475';}#wp-admin-bar-ai-toolbar-no-insertion .ab-icon:before{content:'\f214';}#wp-admin-bar-ai-toolbar-ad-blocking .ab-icon:before{content:'\f160';}#wp-admin-bar-ai-toolbar-processing .ab-icon:before{content:'\f464';}#wp-admin-bar-ai-toolbar-positions span.up-icon{padding-top:2px;}#wp-admin-bar-ai-toolbar-positions .up-icon:before{font:400 20px/1 dashicons;}</style>
What PHP code or filter would you use to remove it?
NOTE: I want to remove CSS output, not hiding divs!
Try this, to remove that inline css. Copy this to your functions.php
add_action('get_header', 'remove_admin_login_header');
function remove_admin_login_header() {
remove_action('wp_head', '_admin_bar_bump_cb');
}
if (!function_exists('disableAdminBar')) {
function disableAdminBar(){
remove_action( 'admin_footer', 'wp_admin_bar_render', 1000 ); // for the admin page
remove_action( 'wp_footer', 'wp_admin_bar_render', 1000 ); // for the front end
function remove_admin_bar_style_backend() { // css override for the admin page
echo '<style>body.admin-bar #wpcontent, body.admin-bar #adminmenu { padding-top: 0px !important; }</style>';
}
add_filter('admin_head','remove_admin_bar_style_backend');
function remove_admin_bar_style_frontend() { // css override for the frontend
echo '<style type="text/css" media="screen">
html { margin-top: 0px !important; }
* html body { margin-top: 0px !important; }
</style>';
}
add_filter('wp_head','remove_admin_bar_style_frontend', 99);
}
}
// add_filter('admin_head','remove_admin_bar_style_backend'); // Original version
add_action('init','disableAdminBar'); // New version
//JUST PAST THIS function.php

Wordpress admin bar and template div

So I have created a wordpress template, and when i log in into wordpress there is a admin bar over main menu. This div wraps the other div's of the website.
My question is:
How can i set div margin-top: i.e. 50 pixels only when there is admin bar, ergo there is a user logged in?
EDIT:
So, this is my code of functions.php and it still doesnt work.
<?php
function new_excerpt_more( $more ) {
return '...<br /><br />Pročitaj još';
}
add_filter('excerpt_more', 'new_excerpt_more');
?>
<?php
if(is_admin_bar_showing() && !is_admin()) {
function link_to_stylesheet() {
?>
<style type="text/css">#wrapper{margin-top:150px;}</style>
<?php
}
add_action('wp_head', 'link_to_stylesheet');
}
?>
EDIT2:
I tried this too... It doesn't work.
<?php
if(is_admin_bar_showing() && !is_admin()) {
function link_to_stylesheet() {
?>
<style type="text/css">body{margin-top:150px;}</style>
<?php
}
add_action('wp_head', 'link_to_stylesheet');
}
?>
To apply top:50px in admin bar when on front end, you may try this (put this in functions.php)
if(is_admin_bar_showing() && !is_admin()) {
function link_to_stylesheet() {
?>
<style type="text/css">#wpadminbar {top:50px;}</style>
<?php
}
add_action('wp_head', 'link_to_stylesheet');
}
To remove admin bar completely, you may try this (put this in functions.php)
add_filter('show_admin_bar', '__return_false');
To remove admin bar from front end only for non-admin user (put this in functions.php)
add_action('after_setup_theme', 'remove_admin_bar');
function remove_admin_bar() {
if (!current_user_can('administrator') && !is_admin()) {
show_admin_bar(false);
}
}
You can setup from your back end (only for yourself) from Users -> Your Profile menu by removing check from
Show Toolbar when viewing site check box
I solved this by adding
<?php if ( is_user_logged_in() ) { ?>
<style type="text/css" media="screen">
body{margin-top:28px !important;}
</style>
<?php } ?>
To the functions.php
Whenever anybody is logged in and has a WPadminbar on the front-end
add this to your functions.php:
function adminbar_theme_setup() {
add_theme_support( 'admin-bar', array( 'callback' => 'custom_admin_bar_css') );
}
add_action( 'after_setup_theme', 'adminbar_theme_setup' );
function custom_admin_bar_css() { ?>
<style>body{margin-top:28px !important;}</style>
<?php
}

Categories