Create navigation based on files in folder - php

Okay so I have my navigation for my entire website in one single file called: navigation-sidebar with the following code right now,
<ul class="sidebar-nav">
<li class="sidebar-brand">Candy Kingdom</li>
</ul>
I then have the actual code for my website pages in the folder called: pages
I am wanting to create a php foreach statement in navigation-sidebar that creates the <li> </li> for each file in the folder pages.
I am not sure how to tell php how to read a directory and create based on that directory. I'm not wanting to type the navigation manually.

Use foreach the glob function:
foreach(glob("pages/*.html") as $page){ // to get all the extentions use "*.*"
print('<li class="sidebar-brand">Candy Kingdom</li>');
}

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.

The Wordpress way URL on static / dynamic pages

I would like to add a menu or footer like in Wordpress or any other CMS.
That really dont work with PHP includes because if a website file is in subdirectory there is a problem with the path.
As you know a normal static menu looks like
<nav>
<ul>
<li>About</li>
</ul>
</nav>
but CMS menu looks like
<nav>
<ul>
<li>About</li>
</ul>
</nav>
And that on all pages so no problems with the path
if you try it with static/dynamic pages you have to add the path or the url and that looks really ugly or not
<?php
define('WEB_ROOT', '../'); // relative path to /
?>
...
<nav>
<ul>
<li>Solution</li>
or
<li>Solution</li>
or
<li>Solution</li>
</ul>
</nav>
I think thats a bad idea and really ugly.
so how to solve that kind of problem maybe with adding a web root in php like above but looks not really good so do you have any other ideas?
And that Solution should also work for CSS and JS not only for static contents, so all styles are same and menus looks just like the other pages even if it is in the subdirectories
Generally in Wordpress I use the site url to generate full urls:
site_url('/about');
As for JS/CSS files, it depends where you are putting them. If the files are located in a specific theme use:
get_template_directory();
you can use it...in "a" tag href="", use this:
echo home_url('index.php/about');
or remove the index.php, just about [the name of the page.]
Done.

HTML - href adds a # to current URL

I'm creating a "web store". I've created a navbar using Bootstrap. I have 3 php files: index, category and article, all .php
<li class="dropdown">
Categories<span class="caret"/>
<ul class="dropdown-menu">
<li>Compu</li>
<li><a href="categorias.php?categoria=Mascotas" >Animals & Pets</a></li>
<li>Office</li>
<li>Music & Movies</li>
</ul>
</li>
The "Category" link works only as a dropdown, you click it and it shows the submenu.
Categorías<span class="caret"/>
This code is in all 3 files, but it only works on index and category. When I click it on the article.php file it only adds a "#" to the current URL.
localhost/store/article.php?id=1 -> localhost/store/article.php?id=1#
I'm using the id to show the selected article's info from a database. I use it too on the category.php file but the dropdown link works there. Everything else works fine, except that link.
Am I missing something?
PS. I'm only using HTML and PHP in my files.
Sounds like you forgot to import the necessary bootstrap dependents on the article page.
Necessary Dependents
CSS
bootstrap.min.css , or theme if you are using
JavaScript files
jQuery
bootstrap.min.js
Sounds like a JS issue.

PHP include Image file not displaying

The header for my website is the same across all of it so instead of rewrite the code and link the style sheets, i've decided to use the <?php include ;?> to put it at the top of every document.
My issue is that the logo that should come with the header isn't displaying.
File Structure
As you can see, the header file is where it is and the logo named "Picture2.png" is in the image folder.
PHP
<?php include('./_/includes/header.php'); ?>
HTML (In header.php)
<nav id="navigation">
<ul id="navList">
<li id="navLogo"><img src="/image/Picture2.png"/>Computing</li>
<li><a class="navItem" href="gallery.php">Gallery</a></li>
<li><a class="navItem" href="topics.php">Core Topics</a></li>
<li><a class="navItem" href="courseview.php">Courses</a></li>
<li><a class="navItem" href="index.php">Home </a></li>
</ul>
</nav>
Part of header that isnt' displaying correctly
NOTE** everything else in the header is correctly displayed, I'm using a local server, should that make a difference
You are using an absolute path for your image.
You should put and use a relative path :
<img src="_/includes/image/Picture2.png"/>
instead of
<img src="/image/Picture2.png"/>
Yep, hes using an absolute path for image, but the project isn't in server root folder then you need's to inform the name of the folder in path...
Use <img src="/finalprojectneat/image/Picture2.png"> then you have your logo display on every page. But is not the most indicated because when you send to production server, you didn't have the "finalprojectneat" folder then you have to remove all paths using "projectneat".
One solution is to define a constant in your "index.php", not necessary in "index.php" but required in root folder of project
define ('_IMAGES_', realpath(dirname(__FILE__) . '/image'));
if you put this constant in another file inside root folder, use "require" to import these constants to your views...
and in your views, use
<?php echo _IMAGES_ . '/Picture2.png'; ?>

Dynamic Navigation?

Currently for my projects I create the navigation for each page manually and it looks something similar to:
<nav>
<ul id="mainMenu"><!--Main Menu-->
<li><a class="active" href="index.php">Home</a></li>
<li>Contact</li>
</ul>
</nav>
This works fine, however for projects that has many many pages it is not a really good practice or even efficient to do it manually. So I was wondering if there is anyone who can direct me to the right path and advice me on how to make my navigation dynamic? I know about PHP include and the .inc files - they are good. BUT I want to add class .active to the <a> of the page that is currently open. How can I do that?
BTW: I don't know if this s the right place to post this sort of questions here, but the moderator told me to post it here.
Use include to add a central php file, that contains a function which can take the current page as a parameter:
nav.inc:
function renderNavigation($current_page) {
//render you navigation
}
main.php:
require_once("nav.inc");
renderNavigation("Subpage 1")

Categories