How to place calls to divs globally - php

I have some divs that I want to display under some specific conditions in every page. I put the calls to them in the footer like this:
<div id="loginpopup" style="display: none;">
<?php
include '/auth/login_form.php';
?>
</div>
<div id="createprofilepopup" style="display: none;">
<?php
include '/auth/create_profile_form.php';
?>
</div>
<?php
// Show div that spins when something is happening
include '/divs/loading.php';
?>
but the urls seem to be mis-pointed. And if I fix the urls on any page, pages in other directory paths will be mispointed. What is the correct way to organize this sort of thing across a site?
Thanks!
By tje way if you want to take a look, the currently broken site is http://www.problemio.com

The way you include the files it loads them from an absolute path (in Linux the root directory). If you want to load them relative to the current script just don't add the leading slash:
include 'auth/login_form.php';

Related

Adjusting link paths in a Navbar PHP file for subdirectories

I'm trying to create a portfolio website. This is my third attempt, and I've been attempting to use PHP files for the first time. In my previous websites, I would copy large swaths of HTML into each page so that they would be formatted the same. With this website, I'm instead just trying to link to a few PHP files that contain code shared by multiple pages, like the navigation bar for instance.
My issue is this. Say in my index file
mywebsite/index.php
I include this PHP file which contains HTML code for a navigation bar
<?php
echo <<<EOT
<!-- Navigation Bar -->
<div id="nav">
<a class="nav-link" id="index-link" href="">About</a>
<div class="nav-divider"></div>
<a class="nav-link" id="resume-link" href="resume">Resume</a>
<div class="nav-divider"></div>
<a class="nav-link" id="portfolio-link" href="portfolio">Portfolio</a>
<div class="nav-divider"></div>
<a class="nav-link" id="contact-link" href="contact">Contact Me</a>
</div>
EOT;
?>
However, the way the links work, if I wanted to include this same navigation bar in a sub-directory webpage
mywebsite/portfolio/index.php
All of the links would stop working.
I've tried doing absolute paths to the root, but then the webpage's url shows the absolute path as well, including things public_html in the url which looks bad.
I've tried doing paths like "mywebsite.com/..." and "mywebsite/..." but thats just shows up as "mywebsite.com/mywebsite/..." and doesn't actually work. If I try saying "public_html/..." public_html becomes included in the url.
I don't want to create a second PHP file just to have the same code with slightly different href paths. Is there a path I could use for both my main directory and subdirectories that doesn't show up weird in the url? If not, is there a way to use Javascript or Jquery to detect if a file is in a subdirectory, and add "../" to all links inside the included PHP files?
I can't seem to find an answer to this question, maybe I'm not using the right words in my searches? This feels like it would be a common issue.

How to include and link menu file into every webpage using HTML?

I have researched some answers that talk about php, javascript, iframes etc. but I have tried a couple and none of them work. I am new to HTML coding.. and coding in general!
<link rel="menu" href="menu.html"> does nothing
<!--#include virtual="/menu.html" --> does nothing (presumably because its a comment?)
<iframe src="page.html"></iframe>
or object... both place the menu in a silly little scroll box.
I want to run my menu on my page as if it were a function in C. Where I can just include it, and it be there, or just link it.
Thanks for the help!
Ryan
webpage file: biology.html
menu file: menu.html
<div class="container">
<img src="homeicon.jpg" width="50" alt="Home">
<div class="redhover">
<div class="dropdown">
<button class="dropbtn">GCSEs</button>
<div class="dropdown-content">
Chemistry
Biology
</div>
</div>
<div class="dropdown">
<button class="dropbtn">A-Levels</button>
<div class="dropdown-content">
Chemistry
Biology
</div>
</div>
<div class="dropdown">
<button class="dropbtn">University</button>
<div class="dropdown-content">
Telecommunications
Electronic Engineering
</div>
</div>
<div class="dropdown">
<button class="dropbtn">More</button>
<div class="dropdown-content">
About me
Youtube
</div>
</div>
</div>
</div>
You can use php to include files on other pages. Here is some example code to get you started:
<?php
require_once('menu.php');
?>
You can put this in your HTML page appropriately, however you must make sure that php can be processed on your server and the file containing php code must end in the .php extension.
There are also other methods of including files via php, see here:
http://php.net/manual/en/function.include.php
and
http://php.net/manual/en/function.require.php
Edit - I'm not a big fan of this approach, but it will work on Github pages.
Create a file called nav.js with your menu defined as a js variable, then use javascript to insert it into an empty div created on each page. This way to update your nav you only have to ever edit nav.js Not pretty but it works
nav.js
var navigation = "<nav>";
navigation += "<ul>";
navigation += "<li>Home</li>";
navigation += "<li>About</li>";
navigation += "</ul>";
navigation += "</nav>";
document.getElementById("navigation").innerHTML = navigation;
Other pages
<div id="navigation"></div>
<!--rest of page goes here.-->
<script src="nav.js"></script>
Fiddle: https://jsfiddle.net/ze3hLxx8/1/
There are multiple ways to include a file into another depending on the backend technology you wish / want / need to use.
PHP
The most common way to do it in php is by using the include or require statement inside a php file.
In your specific case your biology.html file must be converted to a biology.php file and then you can add the relative code to include the file:
<?php include('menu.php');?>
This simple statement will add the content in your menu.php file to the current page. This will not work if php is not present on the server and obviously will not work locally without a local development environment
The differences between require and include can be found on the official documentation:
include: http://php.net/manual/en/function.include.php
require: http://php.net/manual/en/function.require.php
SSI
Another method is to use Server Side Includes. To use the SSI it must be supported and enabled on the webserver. To use SSI you need to change the extension from biology.html to biology.shtml and then add the following statement:
<!--#include file="menu.html" -->
More information on server side includes can be found on wikipedia: https://en.wikipedia.org/wiki/Server_Side_Includes

Website Navigation within the Header

I am having trouble properly setting up navigation on my website. I am putting the navigation into my header and I want to get all of the links to work no matter what layer in the file structure that the webpage is on.
This is my file structure:
Website (directory)
index.php
resources (directory)
includes (directory)
html_codes.php
Game (directory)
game_info.php
resources
Characters (directory)
characters_info.php
Players (Directory)
players_info.php
Inside the html_codes.php is a function that builds the header for the website. I use this function to create the header at the top of all of my web pages. However the hyperlinks that navigate around the website do not work in any layer except the top-level directory because their relative position has changed.
Is there a way to get the links to work in
./index.php
./game/game_info.php
./game/Characters/characters_info.php
./game/Characters/Players/players_info.php
from the same create_header() function?
My create_header() function:
function create_Header(){
echo '
<div id="top_header">mywebsite.com </div>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>Game</li>
<li>Characters</li>
<li>Players</li>
<ul>
</nav>
';
}
*********************************EDIT***************************************
Okay, I used your suggestions and it solved some problems and created others.
First off, turning the paths from relative to absolute worked but it required that I change the path names to
/Website/index.php
/Website/game/game_info.php
/Website/game/Characters/characters_info.php
/Website/game/Characters/Players/players_info.php
which is fine but I don't understand why. I assume it is because the Website directory is a sub-directory for C:\xampp\htdocs\Website.
The other issue is that my include functions don't work with this absolute path.
The relative path for the include inside of game_info.php before was
include("./../includes/html_codes.php");
which did and still does work.
I have tried both
include("/includes/html_codes.php");
include("/testphp/includes/html_codes.php");
and they did not work.
Two things
1. i recommend not making capitalized folder names in your source and in this header. otherwise some browsers may require the capitalization by your users. which isn't really standard.
2. i recommend you use absolute paths (removed .)
function create_Header(){
echo '
<div id="top_header">mywebsite.com </div>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>Game</li>
<li>Characters</li>
<li>Players</li>
<ul>
</nav>
';
}
Put a forward slash / in front of your paths to make them absolute.
Go home
This will ensure that you're always starting from the same place (root), and that your links are independant from the hierarchy.
If your website is live, you can use an absolute URL like this one :
Go home
./ is relative to the current directory. There are two ways to solve it. The first one: keep using relative paths, but let them move up as well. So if you are on ./game/Characters/characters_info.php, the directory is ./game/Characters/, and the path to home is ../../index.php.
So you'll need to know not only the depth of the current page, you'll need to get up to a level that is shared between the current page and the target page. After all, both could be two levels deep, but still are in a different directory.
I think a better (at least much easier) way is to use an absolute path. To do that, you can just start with a / to have the absolute path from the domain name.
Optionally, you could configure an 'installation path' or 'base directory' to start each path with. It could default to just '/', but you could set it to another value if the site was entirely in a subdirectory.
So the header would look like:
<div id="top_header">mywebsite.com </div>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>Game</li>
<li>Characters</li>
<li>Players</li>
<ul>
</nav>
Or, with a base path variable, you can move the site to another directory, just change the variable, and everything will still work. Very convenient for testing and development. The normal value for this variable can just be ''.
<div id="top_header">mywebsite.com </div>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>Game</li>
<li>Characters</li>
<li>Players</li>
<ul>
</nav>

How to Make or Call sidebar in CakePHP

I have such type of code in view, add.ctp file in Cake PHP.
<div id="container">
<div id="content">
------------------
</div>
<div id="sidebar">
----------------
</div>
</div>
Now in Layout, in default.ctp file, we access this code by this line.
<?php echo $this->fetch('content'); ?>
I have sidebar in each and every view file, and if I need some changes then I will go in each and every file and then change.
Now My Question is that, can I made a file in layout like sidebar.ctp or any thing else that I just call this file in my view. If I can, then how I will made such type of file.
You could do it with include or elements like this
<?php echo $this->element('sidebar'); ?>
With the element, you make the sidebar.ctp file in the View/Elements/ folder.
Check for more information: Cakephp 2 Elements
The other way is with include (not my choice, but another way to accomplish it)
<?php include('../View/Layouts/sidebar.ctp'); ?>
You can use elements and if the content in elements is dynamic you can use the blocks supported in latest version of cakephp.
http://book.cakephp.org/2.0/en/views.html

Open links placed in different divs in one div with php

I've been looking at this for a few hours now and I've probably overlooked something silly, but I really can't get this to work.
I have created a .php file with four different php-files which are included with the
I am practicing with building websites and my first website used to solve this problem with frames, I could simply target every anchor tag to the mainframe and it worked perfectly. However, as frames are a deprecated feature, I decided to replace them. I can't seem to get the links working however.
There are tons of answers around, and that's probably the biggest problem, I can't figure out which solution fits to my specific design. Sorry if this is a doublepost.
This is what I've created so far:
<div id="header" class="header">
<img src="Images/metallic.png" width="125" height="125" alt=""/>
<img src="Images/database.png" width="85%" height="125" align="right" alt=""/>
</div>
<?php include 'Parts/upperdivs.php'; ?>
<?php include 'Parts/navigation.php'; ?>
<?php include 'Pages/main.php'; ?>
As said, there are buttons with hyperlinks in the navigation page and 'normal' hyperlinks in the upperdivs. Is there a way to open all those hyperlinks in the main content div, without having to copy all I've already got? I've read a lot of information about Ajax and the PHP-load feature, but I'm not sure what I should use. I've tried adding it as well, but couldn't get it to work. Thanks in advance!
Edit: I've also tried using an Iframe with an Iframe ID, and pointing to it using the target-tag. The problem is that the pages differ very much in content - if I set the height of the Iframe to, let's say, 1000px, it's way to large and you can scroll too far down on pages with minimal content, and if I set it to 100px, I get two scrollbars, one on the Iframe and one on the right side of the webpage, which is very ugly - and above all - very annoying.
Without being clear on exactly what you're asking, I assume you're looking for an easier way to handle includes.
This is not the best way to do it, but I would have each page be in the URL you want, and have the 'Parts' pages be in a separate folder.
/
| main.php
| about.php
| news.php
/ Parts
| navigation.php
| upperdivs.php
| EVERY_PAGE.php
Then as a shortcut, you could make EVERY_PAGE.php like this:
<div id="header" class="header">
<img src="Images/metallic.png" width="125" height="125" alt=""/>
<img src="Images/database.png" width="85%" height="125" align="right" alt=""/>
</div>
<?php include 'Parts/upperdivs.php'; ?>
<?php include 'Parts/navigation.php'; ?>
On each page you would do this:
<?php include 'Parts/EVERY_PAGE.php'; ?>
///
// ... Page code here ...
//
Also, it's good to learn some better styles of coding, but this will get the job done in a clean and quick way.

Categories