How do I get CSS styling on navigation through included php script? - php

I am building a website that uses includes php scripts.
I've got a header.php file, where it contains the logo, and the navigation, and a footer.php file that contains information. These are loaded from the main content files, for example, from the home page, I have a <?php include 'header.php'; ?> script.
The main problem I am having is the navigation. Because it is included in the header, none of the formatting is working as it should, so when I click on a page, the CSS styling doesn't change so the user knows what page they are on. From what I am gathering, the header.php file is refreshing the information.

Including the header.php file won't affect this as the CSS is processed on the client side.
What you need to do is have make your header.php file aware of which page it is on so it can assign a class to the navigation element appropriate to that page. Then make sure you have a rule in your CSS that specifically states that any navigation element that has that class will be highlighted appropriately.
A rough example:
page.php
$current_page = 'home';
include('header.php');
header.php
<ul>
<li<?php if ($current_page === 'home') echo ' class="highlight"'?>>Home</li>
<li<?php if ($current_page === 'about') echo ' class="highlight"'?>>About</li>
</ul>

Related

How to include a bootstrap modal that is accessible to all pages

I have a header file that contains my nav items. Views are loaded in dynamically depending on the link clicked using PHP.
The views currently are about 4. something like
<?php
require_once 'header.php';
//Pull in view or page depending on link clicked
$pages = ['dash'=>VIEW_ROOT.'dashboard.php', 'registration'=>VIEW_ROOT.'register.php', 'payment'=>'transaction.php'];
$page = (isset($_GET['page']) ? $_GET['page'] : 'dash');
include_once $pages[$page];
require_once 'footer.php';
The link that should open the modal is in the header file and the header file appears in every page. At the moment I have to write the modal div(the div containing contents of the div) in all the views so I can access it from every page. Can there be a way of writing it once and it will be available in all the views without duplicating same code in all views.
Will it be recommended to stick the div containing the modal in the header file? Any good recommendation will be appreciated.
Yes you can put it in your header.php, but i would recommend to create a extra file and include it into the footer.php
Hidden stuff is mostly at the bottom.
Why not just add it to your header.php or footer.php since they are static.

How to include header/footer/etc.php with content in between for each page?

I'm looking for an object-oriented solution or possibly a framework that already exists to do what I'm hoping to do for a somewhat small back-end/admin project.
For instance, the system is to manage Projects. So there will be a header/footer/menu on every page. Two pages, for instance, will be projects.php and notes.php.
To include the header and footer on these pages I would normally do:
//header.php
<!-- Header Content Here -->
include menu.php
//projects.php
include header.php
<!-- My Projects Content Here -->
include footer.php
//notes.php
include header.php
<!-- My Projects Content Here -->
include footer.php
and have my links to each page just be '/projects/' or '/notes/'
I've also tried:
//index.php
include header.php
include projects.php
include notes.php
include footer.php
//projects.php
if(isset($_GET['projects']) {
<!-- My Projects Content Here -->
//notes.php
if(isset($_GET['notes']) {
<!-- My Notes Content Here -->
and have the links in my menu be '/index.php?projects' and '/index.php?notes'.
Both are frustrating and don't seem very fluid to me. I would like to upgrade my tactics here but am unsure the best way to go about it.
What's the best way? Is there a Framework that is lightweight and can manage these for me? I would like to keep the links at '/projects/' and '/notes/' but just be able to create an object that calls the content from projects.php and places it in automatically on that link click.
TLDR; - I don't want to have to place header/footer/etc.php as an 'include X' into every PHP page template file manually. I would like for it to know that every page needs it unless otherwise assigned.
Create a file called something like page.php:
if(!empty($_GET['page'])) {
// Could add check to see if file exists
$page = $_GET['page']; // Being "notes" or "projects"
include 'header.php'; // Assuming this includes <head>, header, menu, functions etc.
include $page.'.php'; // Makes notes.php or projects.php
include 'footer.php';
} else {
echo 'Someting went wrong';
}
For links in menu it should be page.php?page=notes or page.php?page=projects
Every file? Are you really sure you want to do that? It might cause data crash.
But if you insist, look for your php.ini file and find auto_prepend_file
http://php.net/manual/en/ini.core.php#ini.auto-prepend-file
auto_prepend_file header.php // For Example
Now that you did that if you don't remove header.php from every program (or make sure include_once is used) then you might have php errors flying around.

Is there PHP code I can use to automatically detect which link should use a CSS active property?

Sorry if that wording was confusing - I am very new to PHP, as I am designing a website for my small organization and only have previous experience in CSS and HTML.
Basically, I included the header and footer in the site using a PHP include so that it would only take one update to change all the links, as it is a pretty big site with a lot of pages that would take forever to update in HTML.
The problem I am having now is that since the php include is only one page, no matter what page you are on, the category in the header menu that is 'active' and highlighted blue is the one that I originally copied the menu from to create the .php file. Obviously, I want it to be whatever menu category you are actually in, and not just that same one every time. I am sure there is a very easy way to do this in PHP, but I was having trouble finding anything because I wasn't exactly sure how to word the question when I searched for it. Thanks in advance to anybody who can help!
Simplest method, using a global variable and a lot of conditional logic:
Any file on your site:
<?php
$current_page = 'name of page here';
include('menu.php');
... page content/logic here ...
menu.php
<?php
if (!isset($current_page)) { $current_page = 'home'; }
?>
<ul id="menu">
<li<?php ($current_page == 'home') : ' class="current"' : '' ?>>Home</li>
<li<?php ($current_page == 'foo') : ' class="current"' : '' ?>>foo</li>
etc...
</ul>
I don't know how your menu look like, but you can test the current page with PHP_SELF
<?php
$urls = array('index.php', 'include7.php', 'about.php');
$current_page = basename($_SERVER['PHP_SELF']); // if for example you are in /folder/index.php ; the basename will output only 'index.php'
?>
<?php foreach ($urls as $url): ?>
<?=$url;?>
<?php endforeach; ?>
In my example, I was in include7.php file, so in the output, only it was colored green, other 2 were colored red.
The method I prefer of doing this uses no PHP logic at all. In each of your pages, add a class to a high-level element, such as body:
<body class="home">
Then in the menu, add a matching class name to each menu option:
...
<li class="home">Home</li>
<li class="whatever">Whatever</li>
...
And then in the CSS:
body.home li.home a,
body.whatever li.whatever a
{
color: blue;
}
...or whatever style you want, using whatever selectors you prefer, the key being that the CSS looks for a matching body and menu item classname, and therefore only highlights the item for the current page.
This means that there's no PHP logic whatever. When you create a new page, add a body class for it, and a matching entry in the menu, and add it to the CSS.
I tend to use this method in situations like yours, when PHP isn't being used as a server-side language or a CMS system so much as a very simple template-builder. It keeps the server-side code very minimal, which matches the rest of the setup.
The way I would do it:
1) detect the page you're in from within PHP
2) update the parts of your header/footer that depend on the page you're in
detecting the page you're in
The $_SERVER['PHP_SELF'] superglobal variable will give you the path of the current page relative to the site root.
For instance, if your page is http://whatever.site.com/about.php, it will give you /about.php.
It means you can use the name of the current page as a key to change whatever behaviour from within your generic header/footer.
Depending on the way your pages are stored, you can easily synthetize a simple identifier for the current page (something like "index", "about", "contact", etc).
You can then put that in a global $PAGE variable allowing you to identify your current page from about anywhere in your PHP code.
updating the variable parts
If you need some item to change according to the page you're in (typically highlight the current page in your header), you can easily do it by checking $PAGE :
<li class='.<?php echo $PAGE=='about' ? 'selected' : 'unselected' ?>about
<li class='.<?php echo $PAGE=='contact' ? 'selected' : 'unselected' ?>contact
You might also want to do some less redundant code generation, for instance:
<?php
function menu_items ()
{
global $PAGE;
foreach (array ("home", "about", "contact") as $page)
echo "<li class='.(($PAGE==$page) ? 'selected' : 'unselected')."'>$page";
}
?>
<!-- header menu -->
<ul><?php menu_items(); ?></ul>

How to link navigation/buttons to the whole site using one file?

Is there a quicker way to make the navigation bar/buttons go onto all my pages of my site instead of going into each .php file and copying and pasting it. How would I link up the class="button" to another file so that it changes the whole navigation on my site?
Just use an include statement.
include 'nav.php';
on each page.
Nav.php could then contain nothing more than just the navigation.
First Separate your php file as header.php for header menu and footer.php for footer menu.
And then include the file in pages .
See this example for reference.

How To Set CSS Classes On HTML Tags Which Are Included In The Page With PHP Include's

I'm building a website which uses a lot of repeated styles and HTML tags, such as the header, the navigation bar at the top, and the footer at the very bottom. Instead of typing all of that repeated code in again and again, I'd like to use PHP include statements to include everything that I need.
While that's all well and good, this poses a problem with my navigation bar. I use a CSS class attached to the navigation link to let the user know what page they're on (using a different background color). On each page, I manually specify which link gets that special class. If I were to simply include that content via a PHP include statement, I couldn't manually specify the class.
My question is: how would I be able to do that? Either by using a separate PHP script to find out which page the user is on, and then specify the class to style the link appropriately, or by using JavaScript to do the same thing? Or maybe there's something else that I'm missing? Who knows! And as such, I ask!
An easy way to do it would be to add a PHP variable like $page before the include and then use this variable in your included menu file to determine which menu item needs highlighting.
So in the file with the includes:
$page = "home";
include("menu.php");
And in the menu file:
<ul>
<li <?php if( $page == "home") echo 'class="active"' ?> >home</li>
<li <?php if( $page == "about") echo 'class="active"' ?> >about</li>
<li <?php if( $page == "contact") echo 'class="active"' ?> >contact</li>
</ul>
The example above isn't the tidiest or most optimal solution, but it gives you an idea of how you could achieve what you are trying to do by using PHP variables.

Categories