I was given the task of customizing a specific section of a website. This section is primarily made by an Event Manager Plugin on WordPress. This plugin allows users to create their own events that will be published in a calendar page. The thing is, I need to get rid of the page header only on the pages created by this plugin, that will have an URL similar to this: http://mypage.com/eventos/user-event-name
So, I only need to apply the code .site-header { display: none; } ONLY to the pages that have this /eventos/something URL. Can this be done?
When I put the above code on the Custom CSS of my theme it gets rid of the header across the whole website, and I don't want that.
I have absolutely no background in CSS so I most definitely am using the wrong definitions here. Thanks in advance, hope someone can help me!
You can check if there is evestos in URL and add a class to body
like this
add_filter( 'body_class','my_body_classes' );
function my_body_classes( $classes ) {
$url = strpos($_SERVER['REQUEST_URI'];
if($url, "/eventos/")) {
$classes[] = 'eventos-page';
return $classes;
}
}
After that you can add css to that class like for example
.eventos-page .site-header {
display: none;
}
Related
I am using this code but it does not work as I want, I want to put different classes in both menu as I can do this
add_filter( 'nav_menu_css_class', 'additional_active_item_classes', 10, 2 );
function additional_active_item_classes($classes = array(), $menu_item = false){
if(in_array('current-menu-item', $menu_item->classes)){
$classes[] = 'active';
}
return $classes;
}
I want to affect the primary menu without the footer menu being affected to set another class to activate the footer menu but if it is not possible I would love only to accept the primary menu
There are a lot of different menus in wordpress. Which specifically do you want to affect? Are you referring to the frontend interface that visitors see? Or maybe the backend admin area's sidebar?
Unless there is a specific reason, it would be unlikely to need to add an additional class--the menu items already have a special class assigned to them when they are the current page.
These menu items can be styled with the following css selectors:
admin area: #adminmenu li.current{}
frontend: #top-menu li.current-menu-item{}
If you need additional help, please provide more specific information!
EDIT:
#top-menu li.current-menu-item a{
color: blue;
}
.bottom-nav li.current-menu-item a{
color: red;
}
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>
I am having trouble overriding the default styling that comes with WooCommerce. Specifically, I am trying to hide certain fields that display on my checkout page (see screenshot of the code). I mocked up my page on Code Pen and my css is working fine, so I am not sure why it doesn't work on my styles.css of my child theme. Any help is appreciated!
.variation li div:first-child {
display: none; }
https://codepen.io/jagorski/pen/oZBYrd
Clear the browser cache & try this:
.variation-JobListing:first-child {
display: none !important;
}
I am working on this website. I am trying to filter the the two arrows shown above each image(previous and next) if its the front page. I have created the following hook for it,
function removal() {
return null;
}
if(is_front_page()){
add_filter('prev', 'removal');
add_filter('next', 'removal');
}
The problem is that the images are still getting displayed. Any ideas why?
Edit: there is a more elegant way in the CSS style-sheet, taking advantage of the fact that WP gives the home page's body the home class:
body.home .prev,
body.home .next { display: none }
this targets the "prev" and "next" buttons on the home page only.
Old answer: Output the CSS in your if(is_front_page()) call.
In the page's <head> section, do
<?
if(is_front_page())
echo "<style type='text/css'>.prev, .next { display: none }</style>";
?>
I'm getting into wordpress and I've been following some pretty good tutorials and reading through the codex but I've encountered a problem which I can't seem to find the answer to anywhere else. Eventually my plan is to create an interface for users of my theme that will allow them to change colors, widths, positioning, etc. of certain elements in the template. Basically it will be a php file that will generate a css document. For right now though all it does is echo a sentence. I'm not sure if this is technically a "plug-in" but when I try to put it in the plugins folder, I end up with a 404 error. I know the file is there and I have triple checked the path. I have also tried navigating to the php file directly in the url but I still get a 404 error. I have also tried using the plugin template. It echoes the sentence when I click "activate" in the plugins manager, but it does not work at all when calling it from the functions.php file. Any help is greatly appreciated.
Here is the code which I have placed at the end of my functions.php:
//begin template specific*******************************************************
//------the function below styles the wordpress admin menus.-------
function custom_style() {
echo '<style type="text/css">#adminmenu .wp-menu-image img {padding: 0px !important; margin-left: -3px;}</style>';
}
add_action('admin_menu', 'register_custom_menu_page');
add_action('admin_menu', 'custom_style');
//------this function adds the template specific menu item.---------
function register_custom_menu_page() {
add_menu_page('Epsilon', 'Epsilon', 'add_users', plugins_url('epsilon/eps-manage.php', eps-manage.php ), '', content_url('themes/epsilon/images/eps-icon.png'), 6);
} // this function creates the correct path as far as I can tell, but when I click the link button in the admin menu, I get the 404.
//------this function hides the editor option under the appearance menu ----------
function remove_editor_menu() {
remove_action('admin_menu', '_add_themes_utility_last', 101);
}
add_action('_admin_menu', 'remove_editor_menu', 1);
Why am i getting this 404 error and is there a more correct way to do this?
You are trying to merge a plugin and a theme. plugins_url will only load up the file of a registered and activated (not sure on the activation 100%) plugin, As you are developing a theme it is better to have your management files relative to your theme folder, but to be honest for this type of job as you are a begginer I would keep everything in functions.php and use functions as the callbacks to your menus.