Dynamic change of content in tabs - php

<?php --this is my index page--
header('Content-Type: text/html; charset=iso-8859-1');
include ('Header.php');
include ('Navigation.php');
include ('Content.php');
include ('Footer.php');
?>
<section class="tabs"> --this is my navigation tab--
<ul class="links1lvl">
<li class="active"><a>About</a>
<ul class="links2lvl">
<li class="active">O nás</li>
I'm creating a new web and I need help with some coding. The idea is, that I have 2 sections. First for tabs to choose desired content and second as place to display actual content.
The thing is, I've found a ton of guides but those inlude the content of all tabs on that index page, but I have 20+ pages so that's unreal. What I desire is a page, where only the actual content would change as I click different tabs, without refreshing the whole page AND wich is loaded from ,,external" html/php files. Now I don't need code, I will gladly learn as much as I can on my own, thing I need however is a direction. Where should I look for solution.

You need to use AJAX. This will allow you to trigger a call to an external file via Javascript, and display the result onto the current page without the need to refresh.

Related

Making a header.php file

I want to make a header file, but am not experienced with PHP in almost any aspect. My uncle was telling me that I can use a header file with PHP, and that it was like a CSS with HTML.
The following is the HTML I want in my PHP:
<center><nav>
<ul>
<li>Home</li>
<li>Arcade
<ul>
<li>Action</li>
<li>Arcade</li>
<li>Puzzle</li>
<li>Vehicle</li>
<li>Violence</li>
<li>Defense</li>
<li>RPG</li>
</ul>
</li>
<li>Watch
<ul>
<li>TV Shows</li>
<li>Movies</li>
</ul>
</li>
<li>Extras
<ul>
<li>News</li>
<li>Updates</li>
</ul>
</li>
<li>Support</li>
</ul>
</nav></center>
How could I incorperate that into a header file?
I have looked at other websites such as W3Schools, but they don't seem to work. I think my main issue is that I am not sure how to put the HTML into the PHP document. When I do it, I try to type out the HTML as if it were header.html, only, ya know, it's not.
But anyways, if anybody could even just point me in the right direction of how to incorperate that HTML I included into a header.php file, and what to put in the html.
From what I have seen, the best scenario for including the PHP document in the HTML code is:
<html>
<?php
header('Location: http://www.example.com/');
?>
Right now, I'm putting that HTML in every single page. This is restricting me from making navigational tab changes!
My website is http://www.gameshank.com/
Again, thanks in advanced, sooo much!
Ah... the PHP header command is used to output a HTTP header, so I'm really not sure what you're hoping to achieve via its use.
What you want to do is save your generic header HTML/PHP code into a new PHP file (perhaps called "header.php") and then include the contents of that file within each of your existing PHP pages via an include statement. For example:
<html>
<head><title>Sample HTML page</title></head>
<body>
<?php include 'header.php'; ?>
<h1>Page specific content</h1>
<p>And stuff.</p>
</body>
</html>
By doing this, each page will automatically contain the contents of the header.php file (which will appear wherever you place the include statement) and any changes you require can simply be made to the header.php file.
You definitely can!
On your main page (Lets say index.php), on the top you can put in
<html>
<?php
include 'header.php';
?>
</html>
(Or whatever your header file is called.).
Put that HTML in header.php you want to include.
You have to use include like this
<?php
include('header.php');
?>
or use require
<html>
<body>
<?php require("xxmenu.php"); ?>
<p>This is an example to show how to include PHP file!</p>
</body>
</html>
While you're at this, it's also a pretty good idea split the footer off of your page and place it in a seperate PHP file like you're doing with your header.
The point of this is it allows you to make changes to code that is featured in multiple pages throughout your site without having to go through every single page and make the same change.
For instance if you have "Copyright (c) 2013 Blah Blah Blah" at the bottom of 50 pages on your site, when 2014 rolls around you don't want to edit 50 pages to change 2013 to 2014. You'd just make it once in "footer.php".
And like the others have said, simply include the file in your pages.
<?php
include 'footer.php';
?>

Make a self-aware menubar

So, In the website I'm currently designing (HTML5, PHP, JS/JQuery and Bootstrap), I've got a basic menubar at the top of the page. Just your normal
<ul>
<li>Home</li>
<li class="active">About</li>
<li>Players</li>
<li>Rules</li>
</ul>
Now, there's a lot more to this, such as a login button, etc, but basically it's adding a LOT of clutter to the top of my pages, and I was wondering if there would be any way to put it in a header.php file.
My issue is how I can use it in multiple webpages and still have the class="active" part. The only thing I thought of was making a function where it takes the page name as a string and go through each line and does if (the page is the same as the link) { echo the element with the class="active" } else { echo the element without the class }
Thanks!
You probably want to extract your header to header.php as you said, and then use the PHP include method.
<?php
include 'header.php';
?>
As far as selecting the 'active' class, you could pass and set an '$active' variable on each page. And then, since the included file inherits the scope from the page where it's included, you can get the variable and preform your logic in the header.php page.
http://php.net/manual/en/function.include.php
You can include another php file located anywhere on your server, and have the menu html in there, in a function as you said.
As for keeping the class="active", since you already have it working somewhere, presumably in your main php file, you can just move it to the new header php file that will be included and re-factor if necessary.
I don't know what your code looks like at all, if you post part of it that does the menu, me or someone else will probably be able to help more.

several subpages with same topbar

I have a webpage with several subdirectories for example /search or /friends. Each of this subpages has its own javascript and css files. Now I want all this pages to have the same topbar so if I wanted to change the topbar I would only have to do this in one single place.
What's the common way of doing this? Simple php drops out because of the several scripts and css files. My idea was to call a php script via ajax on each subpage and append the returning string to the body element with jquery's append method but this doesn't seem very clean to me.
How does facebook handle this? Facebook's topbar doesn't even blink when clicking an internal link.
Thanks.
What about using an header.php in all the pages where you want to show your top bar?
To do this just create a file with top bar and save it as header.php and then in your index.php just place include('header.php'); repeat second step for each page where you want to have your top bar.
header.php
// top bar stuff
echo '<ul><li>Link</li><li>Link</li></ul>'; //etc
Other Pages
<?php
include 'header.php';
?>

Minimize code size to avoid duplication of the same code

I need one advice from you. I am working on a website, which uses PHP and HTML. As the biggest part of the header and footer code will be same for many pages, I am thinking of using PHP's include to avoid code duplication. But, each of those pages requires different stylesheets and JS files included. What do you think how could I let the other file know what scripts and stylesheet to import?
Our company does this:
The header reads the filename of the page calling it when it's included.
Then, it changes the extension to '.js' and outputs that if it exists. Same for CSS.
So if I have a page "register.php", it will auto-include "register.js" and "register.css" if they exist.
Here's what I do:
<?php include("includes/headContent.php"); ?>
<title>Page title goes here!</title>
<script src="script_only_used_on_this_page"></script>
<?php
require_once("includes/siteHeader.php");
?>
Site Content Goes Here!!
<?php
require_once("includes/siteFooter.php");
?>
Head Content includes any PHP I want included in every page, as well as the opening html and head tag, and any Javascript libraries and css stylesheets I want on every page. Site header closes the /head tag, and opens the body as well as printing out my site header and some other markup that goes on every page. Finally Site Footer closes out my template. Everything in between is my content area!
There are lots of different ways you can do templating, if you wanted to create a simple include and an echoHeader() and an echoFooter() function... just have the echoHeader function accept a parameter which you would pass your javascript and CSS lines to.
you can use MVC coding pattern

use common template for all pages of website

ok, the title did not make much sense but this is what i am planning to do. I have designed a template for my website, with head body and div for specific stuff and everything. The website consists of header file, footer file, right-side column, header dropdown menu and a main body which would be present beneath the header dropdown menu, to the left of the right-side column, and above the footer. Right now there is some content is this main body area. What i am trying to achieve is that whenever any link is clicked on any of the other parts of the webpage, i want that content to be displayed in this main body. Right now i am copying this template to each and every page, but I want to keep this standard template as index.php and then replace main body content based on the link clicked. This is a php based website. Are there any examples where i can see how this can be achieved? or is there any standard procedure to do this. Please guide me, Thanks.
Here's a very simple way to do this:
index.php
<?php
function putPage($page) {
// put a list of allowed pages here
$allowed = array('page1', 'page2');
$page = trim($page);
$page = (in_array($page, $allowed)) ? $page : 'home';
echo #file_get_contents('.\html\\' . $page . '.html');
}
?>
<html>
<head>
<title>Title</title>
<!-- put stylesheets, js files, etc. here -->
</head>
<body>
<!-- you can have a nav bar or something here -->
<div class="navbar">
Page 1 Page 2
</div>
<?php putPage($_GET['page']); ?>
<!-- put a footer here -->
</body>
</html>
Then just put .html pages with the contents in an html subfolder.
The script will fetch them and insert them in the body.
There are a few ways you can achieve this. Off hand the two obvious ones I would say are:
Ajax to obtain content with event handlers attached to links/buttons/menus that produce maincontent specific to the request.
This requires server and client side scripting to achieve.
w3 ajax
Or alternatively use mod_rewrite with apache to determine what content to load in index.php page. For example with mod rewrite you may have a link http://www.site.com/subject/content/item# as a link structure. This could translate to www.site.com/index.php?subject=&content=&id= And these GET values would allow you to determine what to display in main content area.
This requires server side scripting and configuration of apache or (any web server with similar functionality to mod_rewrite).
mod_rewrite - apache
I use this:
<?php
$pag = array(1 => 'Home.php', 3 => '2.php');
echo require $pag[(int)#$_GET['p'] | 1];
?>
This is called either a Template View as far as you build your link specific HTML completely in PHP. You create a page layout template containing some wildcards. You load the template into a string and use string replacements or XML functions (more fancy but only suggestive if transformation is more complex).
Otherwise it is called Two Step View where you create the page layout template (as above) and a specific template for the links. Now first load the link specific template, put your dynamic content into (same techniques as above), load the page layout template and put the previous transformed specific template into.

Categories