Wordpress Hide Social media sharing links - css

I am using this theme in Wordpress
Click Mag. This theme has a built in functionality which shows sharing options for multiple social media platforms. I would like to hide that for a particular page. Is there any option for that?
I know I can write page specific css but I was thinking if there is any other nice way to do it.
Thanks in advance.

There are a couple of ways to do it.
Add an inline CSS, that corresponds to that page
body.your-page-id #mvp-nav-soc {
display: none;
}
You can also do it with PHP, but not recommended as it increases server load
<?php ?>
<?php if( in_page('your_page') ) { ?>
<style>
#mvp-nav-soc{
display: none;
}
</style>
<?php } ?>

Related

Choosing pages that CSS will work on for wordpress

I'm using wordpress and elementor and some times i need css. Can anyone help me about how I can choose a specific page that css won't work on
I'm using elementor toogle. The toogle come as a closed by default but I want some page's toogle to be opened by default while other toogle, which I use in my website, stay closed by default.
For this purpose, I found the css that is below, but when I use that, all toogle in my website are open by default. For this, I want to except a specific page that the css won't work on.
.elementor-toggle .elementor-tab-content {
display: block;
}
Many thaks for repliers
Using conditional tags, example in the header.php:
<?php if(is_page("page_id or slug")): ?>
<style>
/* some CSS */
</style>
<?php endif; ?>

making the editor more WSWYG

I need to remove the title from the twentytwenty theme - no problem doing this by removing it in the template of my child theme. However it still shows in the WP editor. Since it is in a divider as below:
<div class="editor-post-title">
I have tried adding a CSS like:
.editor-post-title {
display:none;
}
This works perfectly when I try it locally, in my browser editor - but it does not work when I insert that CSS in my style sheet... any thoughts ?
Your theme's stylesheet only loads on the frontend (generally).
Try this article if you want to add various styles to the editor.
Or for a quick-and-dirty fix you could potentially do something like this, but technically the above way is probably better and less hacky:
add_action( 'admin_footer', 'remove_title' );
function remove_title() {
echo '
<style>
.editor-post-title {
display:none;
}
</style>
';
}

How can I change the backgroud and text color for the entire theme using a plugin?

I am trying to change the background and text color for my entire theme using a plug in.
I know it can be done from customizer but I want do learn how to do these basic tasks before I move to something else.
I do not have too much experience in "front-end development"
Thanks in advance!
you can add this function in your plugin and write some css codes.
<?php
function add_to_wp_footer() {
?>
<style>
/* Add Your Styles Hear */
</style>
<?php
}
add_action( 'wp_footer', 'add_to_wp_footer' );
?>

How can I remove right sidebar on single woocommerce product page?

By default on the right side of single product it shows sidebar. The point is that we need side bar only on the Shop page where are located all products. It includes all filters as well as rated products. But on the single product description page we want to remove right side bar. Because in that page it shows only rated products in sidebar. It was there by default. Is there any way to remove it from that page?
This solution i create in 2021 works very good (sorry my english)
/*Single product page no sidebar*/
#blog #sidebar {
display: none;
}
#blog .col-md-push-3 {
left: unset;
}
#blog .col-md-9 {
width: 100%;
}
put this code in main page css code
Visit https://rgrepairofice.ddns.net/loja/gta-v
to check result, if you like it do what i said above
Gaspar Pereira, from rgrepairofice
Currently in the file templates/single-product.php the sidebar is called
/**
* woocommerce_sidebar hook.
*
* #hooked woocommerce_get_sidebar - 10
*/
do_action( 'woocommerce_sidebar' );
Therefore you can remove it with remove_action('woocommerce_sidebar', 'woocommerce_get_sidebar', 10); or wrap it to make sure it only affects single product pages:
if ( is_product() ) {
remove_action('woocommerce_sidebar', 'woocommerce_get_sidebar', 10);
}
Here is the documentation for other conditional tags if you need to get rid of it somewhere else and it uses the same action: https://docs.woocommerce.com/document/conditional-tags/
It all depends on the theme that you are using, as sometimes there is even an option in the theme options or the Customizer for changing layouts to different pages.
Through code, you could probably replace the single-product.php with a page template file that has no sidebar and then reinsert the missing WooCommerce tags, so that WooCommerce does it's magic on the page.
You could try going to [project-name]/wp-content/themes/[theme-name]/woocommerce/single-product.php and look for this line:
do_action( 'woocommerce_sidebar' );
And remove the line or comment it out.
You can also remove the sidebar with CSS only and not touching the PHP files if you don't want to!
For example the following simple CSS codes work like a charm with the Storefront theme (currently that I'm writing this, the theme version is 4.1.0)
.single-product #primary {
width: 100%;
}
.single-product #secondary {
display: none;
}
You won't be able to accomplish this by default with WooCommerce and WordPress. However, it's easy to accomplish if you're not looking to dive into code. A popular choice is Widget Visibility by Jetpack. If you're looking to dive into code, I recommend asking a new question with more details on what you tried to do already.

Highlight Current Page in Wordpress

What is the easiest method of highlighting the current page from a nav menu in Wordpress?
If your top nav links are manually inserted in your theme, you can do something like this:
<a href="page-link" <?php if(is_page('page-name') : ?>class="highlight"<?php endif; ?> >Link text</a>
I do something similar to this in a theme where certain pages and categories have special headers. There are a few conditional functions that help with this:
is_page('page-name')
is_category('category-name')
is_home()
is_front_page()
Edit: Didn't see the comment about it being dynamic WP links. You might still be able to use these functions if the query data you get back contains the page slugs.
You might instead consider using the get_pages() function and loop through it manually, doing an is_page() check on each one to see if the current page ID matches the ID of the page you are at in the array.
Current page highlighting sometimes depends on if it happens to be implemented in the CSS of the theme you're using, but this should work in a basic theme.
<?php wp_list_pages('title_li=&depth=1&'.$page_sort.'&'.$pages_to_exclude)?>
CSS: Change the color in the CSS to whatever highlights well against the background of the menu bar or background image. Change the # to the container of the list pages call above.
#menu ul li a:active, #menu ul li.current_page_item a
{
color:#000;
}
You can use the dtabs plugin, which does just that, for both pages, categories, home, and other types of pages.

Resources