I'm working on a website and I want to change the page contents when a user selects which page they want to navigate to. What I'm trying to accomplish would be like ASP.NET where you have only 1 navigation component that is used across all pages and the content of the page changes when a user selects a different page. How would I be able to accomplish this if I'm building a website with HTML/CSS and PHP. Any information I'm getting is how to change page content dynamically from PHP. I want to change the page content from other files in my directory
easy, you'll create normal pages without navigations, with their normal links, then you'll create navigation to add it as a component.
nav.php
<nav>
<ul>
...
</ul>
</nav>
index.php
<?php include_once "nav.php"; ?>
<p>index</p>
contacts.php
<?php include_once "contacts.php"; ?>
<p>contacts</p>
EDIT
If you have too many included and you want a short include to them, you can do this by including all files you want to include then include thi file wherever you want, it's preferred to add them in a separated folder from the pages like components or includes, like
includes / css_files.php
<link rel="stylesheet" href="...">
<link rel="stylesheet" href="...">
<link rel="stylesheet" href="...">
<link rel="stylesheet" href="...">
<link rel="stylesheet" href="...">
<link rel="stylesheet" href="...">
includes / metas.php
<meta bla="" bla="" bla=""\>
<meta bla="" bla="" bla=""\>
<meta bla="" bla="" bla=""\>
<meta bla="" bla="" bla=""\>
include / seo.php
<meta keywords="StackOverflow, HTML">
<meta keywords="StackOverflow, HTML">
<meta keywords="StackOverflow, HTML">
for includes.php files you have to choices:
is to put the include file with the pages in the same directory, and it will be like
includes.php
<?php
include "includes/seo.php";
include "includes/metas.php";
include "includes/css_files.php";
you can but it with other includes in the same directory, but dont remove the includes/ before includes.
includes.php
include "includes/seo.php";
include "includes/metas.php";
include "includes/css_files.php";
then the pages will be like
<head><?php include "includes.php"; ?></head>
<p>...</p>
because including in PHP includes the code COPY&PASTE, so you'll treat it as you write it in pages. For example, index.php will be like if you didn't write includes/ before the filename:
<head>
<?php
include "seo.php";
include "metas.php";
include "css_files.php";
?>
</head>
index lorem ipsum
and it will not include it, so nor the include only takes the file and place it in the file as it is without changing anything
You can use PHP include function to control elements from only one file. Write this in your index.php in the place where you want to place header
<?php include('path\header.php'); ?>
and in header.php write the code like
<header>
...
</header>
and you could add css, javascript, jquery resource files into index.php
And advantage of include code is when visitor look at your page source or developer tools' source it will appear as your header.php file not php include line.
Related
I have a problem so this is my index.php
<?php
require "header.php";
?>
<main>
</main>
<?php
require "footer.php";
?>
The problem is in header.php I am loading CSS and PHP files with paths and it all works in index page but when you go in other pages/directories then files won't load because directory to files is different I am trying to find out how to load those files even if directory changes.
this is the normal way I tried it won't work this is two examples
<link rel="stylesheet" href="css/style.css">
<form action="includes/logout.inc.php" method="POST">
They both work on index page but on other pages they wont load.
You should use absolute urls.
<link rel="stylesheet" href="/css/style.css">
<form action="/includes/logout.inc.php" method="POST">
I wonder whether anyone could help me resolve some problems I'm having in creating a website using HTML, CSS...and PHP for the first time. (My previous attempts at web design were only in HTML and CSS).
The problem at present is that my home-page (index.php) somehow isn't 'seeing' my stylesheet.css.
The code for the index.php is basically as follows :
<?php
$page_title='Home';
[php-code here, to call in include1.php.....Please see below for details]
?>
<div class="copy">
[page content here, in html]
</div>
<?php
[php-code here, to call in include2.php.....Please see below for details]
?>
My folder structure is :
web
css
stylesheet.css
images
logo.png
includes
include1.php
include2.php
index.php
In attempting to call in include1.php (containing doc type declaration, and Head section including reference to stylesheet.css), I've tried the following (inserted between <?php and ?>, as shown above), all without success :
$pathtoinclude1 = $_SERVER]'DOCUMENT_ROOT'];
$pathtoinclude1 .= "/includes/include1.php";
include_once($pathtoinclude1);
and
include('/includes/include1.php')
In include1.php, my reference to the stylesheet.css is :
<link rel="stylesheet" href="../css/stylesheet.css" media="Screen" type="text/css"/>
When I preview the home-page, all I get is the text in default font (Times New Roman?). None of the styling via CSS is being applied.
Can anyone give me some pointers as to what I'm doing wrong?
If that first answer doesn't work, try replacing
<link rel="stylesheet" href="../css/stylesheet.css" media="Screen" type="text/css">
with <?php include 'style.php'?>
And then in the style.php file include the <style> tags and then add the css regularly.
Since you say you are using php for the first time, make sure you have the correct html declaration.
although you have already worked with html,css just a reminder:
<?php
$page_title='Home';
[php-code here, to call in include1.php.....Please see below for details]
?>
<!DOCTYPE html>
<html>
<head>
<!-- MAKE SURE YOU'RE INCLUDING THE
EXTERNAL CSS FILE HERE BUT NOT TO INCLUDE YOUR PHP INCLUDES!
WHICH ACCORDING TO YOUR FILE STRUCTURE SHOULD BE -->
<link rel="stylesheet"
href="../css/stylesheet.css"
media="Screen"
type="text/css"/>
</head>
<body>
<div class="copy">
[page content here, in html]
</div>
<?php
[php-code here, to call in include2.php.....Please see below for details]
?>
</body>
</html>
When you include() the file from index.php, the path looks like:
<link rel="stylesheet" href="../css/stylesheet.css" media="Screen" type="text/css"/>
This path is going one directory back from index.php which is not a valid path. Your path in include1.php should look like this when you include it in index.php:
<link rel="stylesheet" href="css/stylesheet.css" media="Screen" type="text/css">
Also, if CSS includes properly but styles still do not show up, try removing browser cache.
Try this. It worked for me
Let's assume that you CSS file is named 'css.css'
And it is located in the same directory with you home page.
Just add this at the head tag:
Head
Style
<?php include('css.css') ?>
style
head
Don't forget to add corresponding tags
I have a small PHP website with most of my pages of the form:
<?php include("heading.php"); ?>
<!-- Content of the page -->
<?php include("footing.php"); ?>
Where "footing" contains some stuff to put at the end of each file and "heading" a lot of stuff (including another include for the menu). The problem is: I'm starting to have a lot of php file sand I would like to put some of them in folders. The straightforward way to do it is to change the code for the files in the folder to:
<?php include("../heading.php"); ?>
<!-- Content of the page -->
<?php include("../footing.php"); ?>
But it doesn't work as the include literately copy the code instead of executing it in the original file's folder, so any include and css in heading.php won't be found unless I copy those files in the new folder.
Modify heading.php so that the paths to the files it loads are absolute. For example, if you load a CSS file from css/style.css use /css/style.css or http://example.com/css/style.css instead.
You also can edit the include path, either in php.ini or directly in your code:
//Must be called before every include, if not stated in your php.ini
$PATH=get_include_path();
set_include_path($PATH.":/absolute/path/to/your/include/folder/");
Then you can use your include this way, even if you are in a sub directory:
<?php
include "heading.php"; //no brackets
include "whatever.php";
?>
It sounds like you are just losing track of where you are in your directory structure. Using ../ takes you back one level and using ./ (or just /) takes you back to the root directory and ../../ takes you back two levels.
The trick is to know where you are in the directory structure and where the file is that you want to include. If you are including or linking to a file in your css folder but you are in a file that is located in the inc folder you have to go back to the root and then to css so you would put /css/filename.ext
However, if you are in the fonts/glyphicons folder and want to link to a font in the fonts/font-awesome folder you could just use ../font-awesome. Clear as mud?
What I do is create three (or more) folders. This helps keep the various files organized and with abbreviated lettering, namely:
css (for stylesheets like bootstrap.css, style.css, etc.)
img (for images, graphics, icons, etc.)
font (for fonts, glyphicons, font-awesome, etc.)
inc (for includes/'snippets' like your heading.php and footing.php)
js (for javascripts such as html5shiv.js, boostrap.js, etc.)
Then in my heading.html file (I use html for the header and footer) I include some items like so:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title><?php echo $page_title; ?></title>
<meta name="Description" content="<?php echo $page_description; ?>">
<meta name="Keywords" content="<?php echo $page_keywords; ?>">
<meta name="Author" content="<?php echo $author_name; ?>">
<meta name="Viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link href="/css/quicksite-redsand.css" rel="stylesheet">
<link href="/img/mm.png" type="image/x-icon" rel="shortcut icon">
<!--[if lt IE 9]><script src="/js/html5shiv.js"></script>
<script src="/js/respond.min.js"></script><![endif]-->
</head>
<body>
Then in my pages such as the index.php (homepage) I set up some parameters for that particular page plus include some snippets such as header, menu(s), other body text items, and footer, like so:
<?php
$page_name = 'Homepage';
$page_author = 'My Name...';
$page_keywords = 'home, home page, homepage';
$page_description = 'This is the home page for the ...';
$active_home = 'class="active"';
$select_home = 'class="selected"';
include ('inc/config.php'); //common to all pages
include ('inc/header.html'); //common to all pages
include ('inc/menus.html'); //common to all pages
include ('inc/banner.html');
include ('inc/review.html');
include ('inc/footer.html'); //common to all pages
?>
Since in your index.php and probably most of your pages you are at root level, in the home directory so to speak, you only need inc without the /. Looks like PHP doesn't like unnecessary /'s as it gave me an error when I tried...
I know this is a long winded answer but thought I would illustrate for better understanding.
Ok not strictly an answer to your question, but try doing it the other way, have a layout file which has the header and footer included and include the main bit of content dynamically.
<html>
<head></head>
<body>
etc...
<?php include_once '/path/to/content.php'; ?>
etc...
</body>
</html>
I am not sure if I understand your problem properly , but I have the following answer
I think you should use relative css paths to your website address
for example if we have a css file it should be like that
<link ...src="/styles/somecss.css">
so where ever you put it in your application this would take the path
http://wesiteaddres/style/somecss.css
and you can set your include path to whatever directory you want
set_include_path() ;
Hope this would help
So I'm dividing my index.php page into three sections: top, middle, bottom. The middle section will have different html php inlude pages and therefore will require different style sheets. Do I link the specific stylesheets in the individual php include pages, or in the index page? Because in the index page, the different style sheets don't seem to take effect, why is that?
Say your about page has a custom css file it needs you could do something like this:
about.php
<?
$css = array('path_to_css_file', 'path_to_another_css_file');
require_once('header.php'); // aka the top
?>
[about page content goes here]
<?
require_once('footer.php'); // aka the bottom
?>
The in your header.php file you could do this:
header.php
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="main_style_sheet.css" />
<?
if (isset($css) && is_array($css))
foreach ($css as $path)
printf('<link rel="stylesheet" type="text/css" href="%s" />', $path);
?>
</head>
<body>
This way you only load what you need for the given page.
I have menu.php, and in the <head> section of menu.php, I have menu.css as a link rel tag of course, both of which work perfectly fine.
Since menu.php is a 'menu', I've required it on pages that need a 'menu' in order to navigate around the website. However, whenever I require menu.php on a page that has its own CSS stylesheet, menu.php inherits the <body> font-size of the other stylesheet.
Here is what I'm trying to say: So if I require menu.php on profile.php, menu.php elements will become the size of profile.css, instead of what they really ought to be(menu.css). How can I fix the following problem? Currently, I am requiring menu.php BEFORE the <html> tag.
Should I put this within <head>? Somewhere else?
Thank you.
Some of the code from menu.php:
<html>
<head>
<link rel="stylesheet" type="text/css" href="menu.css" />
</head>
<body>
</body>
</html>
I've put my PHP code before the <html> tag in the file above.
The below code comes from main.php:
<head>
<link rel="stylesheet" type="text/css" href="main.css" />
</head>
If I understand you correctly, you include a complete html page generated by menu.php before the html in main.php. That would get you 2 <html> sections, 2 <body> sections, etc. in one document. That should lead to lots of trouble.
You should include your menu in for example a div inside the main page like (just an example):
main.php:
<body>
<div id="nav">
<?php require 'menu.php'; ?>
</div>
...
</body>
and put all menu styles in the main style-sheet, pre-fixed with #nav. Or as a separate style-sheet, but still pre-fixed with #nav (every style) so that they overwrite the main document's styles.
Could you paste the content of your menu.php? Because if there are and section there...you're doing it wrong, because in that way you're going to have two head and two body parts. Think for require in php as copy and paste.
Your options:
Migrate to some template system(as Smarty for example).
If there should be menu.php on each page, why not putting this css as static file in the header
Paste some code, so we could help you easier ;)