Change CSS for logged in users WordPress | X Theme - php

I am attempting to change some css to display:none; when the user is logged in.
It's just a "Sign In / Register" link. ( so when the user is logged on they wont see it)
<span class="hide-this-class-when-logged-in">Sign Up / Register</span>
I have copied my _header.php file into my child theme, and replaced
<body <?php body_class(); ?>>
with this
<body<?php echo (is_user_logged_in() ? ' class="logged-in"' : ''); ?>>
thinking that this would provide an additional .class for logged in users, so I could then
.class {display:block}
.class .logged-in {display:none}
but the body got all screwed up,( everything got a float left; ) and I am back to the drawing board.
Any input on this topic, or how to use body_class() with x theme would be really appreciated. thanks.

Use this in your header.php file.
<body <?php body_class(); ?>>
This built in function already tracks user status, as well as a number of other useful states like page template, page id, etc.
Example of output:
<body class="home page page-id-403 page-template page-template-page-home logged-in admin-bar no-customize-support custom-background group-blog">
https://codex.wordpress.org/Function_Reference/body_class

SOLVED!!!
<body
<?php
if ( is_user_logged_in() ) {
body_class('logged-in');
} else {
body_class('logged-out');
}
?>
>
goes in your _header.php file
.logged-in{whatever;}
.logged-out{whatever;}

try this
//create two variables
$user_loggedin_class = "loggedin";
$user_notlogin_class = "notloggin";
// add css like this
<style type="text/css" >
.loggedin{
display: none;
}
.notloggin{
display: display:block;
}
</style>
// your span tag should like this
<span class="<?php echo ( (is_user_logged_in())?$user_loggedin_class:$user_notlogin_class ); ?>">Sign Up / Register</span>

Related

PHP & CSS - nav bar not highlighting the current tab

I'm trying to display a webpage with the following tabbed style navbar when clicked :
But I getting this result, even if I click on the links several times :
(kindly ignore texts, those are examples from a reference book)
Below is my code :
<?php
// complete code for index.php
// reporting error if any
error_reporting(E_ALL);
ini_set("display_errors", 1);
// main code
include_once "classes/page_data.class.php";
$pageData = new stdClass(); // (old) declaring a new anonymous class object
$pageData->title = "My Portfolio"; // setting title name;
$pageData->content = include_once "views/navigation.php"; // setting content to page_data() class object
$pageData->css = "<link href='css/layout.css' rel='stylesheet' />"; // CSS stylesheet added from css folder
//changes end here
// URL variable starts here
$navigationIsSet = $_GET['page']; // Click to get page URL via variable 'page' in $_GET['page url'] superglobal array
if ($navigationIsSet) // checking if a page has been clicked
$fileToLoad = $_GET['page']; //get the clicked page's URL value
else
$fileToLoad = 'skills'; // default page view
$pageData->content .= include_once "views/$fileToLoad.php"; // concatenate URL in the content
//URL variable ends here
//new code below: dynamic style added below
$pageData->embeddedCSS = "
<style>
nav a[href *= \'?page=$fileToLoad\']:visited{
padding:3px;
background-color:white;
border-top-left-radius:3px;
border-top-right-radius:3px;
}
</style>";
$page = include_once "templates/page.php"; // linking pages
echo $page;
?>
and this is from layout.css file :
body{
background-color: aliceblue;
}
nav {
background-color: #CCCCDE;
padding-top: 10px;
}
nav a{
display: inline-block;
text-decoration: none;
color: #000000;
margin-left: 10px;
}
nav a:hover {
text-decoration: underline;
font-style: italic;
}
Also if you want to check page.php :
<?php
return "<!DOCTYPE html>
<html>
<head>
<title>$pageData->title</title>
<meta http-equiv='Content-Type' content='test/html; charset=utf-8'/>
</head>
<body>
$pageData->content
$pageData->css
</body>
</html>";
?>
Now that reference book has almost same code to generate the snapshot 1, while my code doesn't show the tabbed nav bar while the user clicks on the links.
Can you please help me to find out what's wrong with the index.php dynamic style ? I'm using PHPStorm with PHP 7.2 as php IDE.
Thanks in advance
You should add a active class to the current selected tab. In that css class you can change the style for only that tab. Below here you see how to add the active class with an if statement to a li object in your navbar. Then in your style.css you can change i.e. the background-color for that class.
<li>
<a href="<?php echo base_url();?><?php echo $this->uri->segment(1) ?>/home"
class="<?php if($this->uri->segment(2)=="home"){echo 'active';}?>">
Home
</a>
</li>
I think I found my answer accidentally ;)
before $page = include_once "templates/page.php"; // linking pages
add this echo "$pageData->embeddedCSS";
this works exactly as I wanted. :D

Check if form exists on a page and hide it

I am using osclass for a classifieds website. The theme has some widgets of which one is a search form. It is called into a header which exists on all pages. However, I would like to hide the search form only on this one page.
The form looks like this:
<form class="nocsrf navbar-left form-vertical" action="<?php echo osc_base_url(true); ?>" >
<div class="dropdown navbar-form js-menu-search-container">
…
…
</form>
How can I condition the form to show on all pages except on this one only: item-post.php?
I would greatly appreciate some help here.
You could have a style tag just on that page that hides the search form.
Add the following to the page you want to hide the form on:
<style>
.dropdown.navbar-form.js-menu-search-container {
display: none !important;
}
<style>
<style>
.form-hide{
display:none !important;
}
</style>
<?php
function need_hide_condition(){
$pos = strpos( $_SERVER["REQUEST_URI"], "YourUrl"); //likes /test.php
if( $pos!=false ) return true;
else return false;
}
?>
<form class="nocsrf navbar-left form-vertical <?php if( need_hide_condition() ) echo 'form-hide';?>">

How can I apply CSS Style to my second page [about.php]?

My File names:
1.) about.php
2.) styles.css
The same stylesheet is also applied to index.php .
I want to style the section part of the page. I tried it by styling the [Eg.], .section-info{color:#555;}
but it didn't helped. Also should I change the stylesheet name to styles.php?
Thanks In Advance.
<?php
/* Website Header */
include ("include/header.php");
?>
<!-- Website Page-2 Main Content -->
<div class="wrapper">
<section>
<div class="section-info">
<h2>About Us</h2>
<p>blah...blah...bllah....</p>
</div>
</section>
</div>
<?php
/* Website Footer */
include ("include/footer.php");
?>
Try to give it different class or inline style.
I had a similar problem. I created a function here which I use.
Then I use $page = getPage("ab") which would return about and then you can check what page is in use using the below:
<?php
$page = getPage("ab");
if ($page == "about") { ?>
<style type="text/css">
.section-info {
background: #f00;
}
</style>
<?php } ?>
Put this code inside the <head> of your about.php page. This will apply whatever code you want to that page.

Adding class to div only if user is logged in

I already asked this question, sry, but ill try again.
The question is: How do i bind css to a div, only if user is logged in?
I got following, and it is working(Also session startet and so on)
if (isset($_SESSION['username']))
{
include("/view/leftmenu.php");
}
Now i want to add 20% to margin-left on my maincontent. Maincontent comes after this.
So how do i activate some css to a div only when the user is logged in. PHP!!!!
Sry for asking again:(
<?php
$class = "";
if (isSet($_SESSION['username'])) {
$class = "addmargin";
}
?>
Then in your view/HTML/...
<div class="<?php print $class; ?>">...</div>
Now you just need something like this in your CSS
div.addmargin {
margin: 20%;
}
In the <head> do :
<?php if (isset($_SESSION['username'])) : ?>
<style type = "text/css">
#maincontent{
margin: 20%;
}
</style>
<!-- or add link to the style sheet -->
<link href="logged-in-style.css" rel="stylesheet" type="text/css">
<?php endif; ?>

Different CSS for homepage

Ok, based on the answer here by traitadmin (scroll down) I am trying to display different CSS for my front page and one for all other pages.
Previously, my body tag looked like this:
<body <?php body_class() ?>>
Now, I have edited it to look like this:
<body <?php if (is_home()) { ?> id="home"<?php } else { ?> body_class()<?php } ?> >
Also I have put new stylesheets in my enqueue, and all styles for the homepage now have #home in front of them.
However, there is no style at all now and my site broke down entirely, for all pages.
I think I may need body_class() also for the homepage. But how I can edit this code so that it works?
Easiest would actually be this:
<link rel="stylesheet" href="main.css">
<?php if (is_home()) {
echo '<link rel="stylesheet" href="home.css">'
} ?>
Rules in home.css should have a high priority than main.css. So with this if main.css has this:
body { background-color: white; }
and home.css has this:
body { background-color: blue; }
Since home.css is linked after main.css the rule in home.css will take priority and the background will be blue. This way you can only overwrite the styles you need to and all the other styles will still apply.
In your case after your other wp_register_style() just add an if test and then register another style.
if (is_home()) {
wp_register_style('home-style',get_stylesheet_directory_uri().'/stylesheets/home.css');
}
Looks like a wordpress code so here goes:
In the head:
<?php if (is_home()) {
// loading the stylesheet if it is the homepage
echo '<link rel="stylesheet" href="home.css">'
} else {
// loading the other stylesheet if it is not the homepage
echo '<link rel="stylesheet" href="other.css">'
} ?>
By default, WordPress adds two classes to the body tag: on the front page (is_front_page()) the home class is added, and on the home page (is_home()) the blog class is added. So, in your main CSS file, you can use the body class as follows:
#mydiv {background:green;}
.home #mydiv {background:blue;}
.blog #mydiv {background:red;}

Categories