PHP - structuring folders, paths, templates

123 Views Asked by At

I have a question about templating my php project.

Currently my folder structure looks like this:

/Root
|index.php
|_footer.php
|_header.php
|_nav.php
|
|site_1.php
|site_2.php
|
|css/
|js/
|images/
|subfolder1
   |site_3.php
   |site_4.php
   |subfolder2
      |site_5.php

I usually include "_header" and "_footer.php" in my index.php file, but I have problems with subfolder pages. For example, my _header.php has an include "_nav.php". But when I include the _header.php in the site_4.php I get the problems with the assets and navigation.

I read to make a config file to define site url, asset paths etc, but It's not so clear to me. Ideally I would like to have an "assets" folder with subfolders for css, js etc.

Also I would like to know who can I with include "_nav.php" with site_url(). I tried that out, but I always get errors. The main question is, how to make the site_url, base url (at this point I'm still confused about those terms and how to use them) Thank you.

2

There are 2 best solutions below

0
On

Because you're using pure PHP (no framework being used) this is a bit tricky. There are several ways to solve this, I'd suggest the following:

In your Root folder, create new file, let's name it "base.php", which has the content of:

<?php
// This is base.php
define('ROOT_PATH', realpath(dirname(__FILE__)));

Now, in each of your site pages like (site_1.php, subfolder1/site_3.php, etc.) include the base.php file:

<?php
// This is site_1.php
require_once 'base.php';
// ...

In subfolder site pages, include it like this:

<?php
// This is subfolder1/site_3.php
require_once '../base.php';
// ...

If deeper site page, include it like this:

<?php
// This is subfolder1/subfolder2/site_5.php
require_once '../../base.php';
// ...

Now, in any php file, if you want to include another php file (like _nav.php), you can include it like this:

<?php
// This is _header.php
require_once ROOT_PATH . '/_nav.php';
// ...
?>
<!-- to include any css/js/images files, it would be like this: -->
<link rel="stylesheet" type="text/css" href="/css/my_css.css">
<script src="/js/my_js.js"></script>
<img src="/images/my_image.jpg">

I didn't test the code, but it should work.

0
On

What you're looking for is the HTML base tag. This will make every relative link use the specified base.

ie. having this in your head:

<head>
    <base href="http://www.yoursite.com/assets/" />
</head>

...will make the following code load the image from the assets folder:

<img src="image.jpg" />

See: https://www.w3schools.com/tags/tag_base.asp