Css link to php file - php

enter image description hereI added a css link to my php file, but it won't show the changes.
My css file is named register.css and my php file is named register.php.
<?php
include("includes/config.php");
include("includes/classes/Account.php");
include("includes/classes/Constants.php");
$account = new Account($con);
include("includes/handlers/register-handler.php");
include("includes/handlers/login-handler.php");
function getInputValue($name) {
if(isset($_POST[$name])) {
echo $_POST[$name];
}
}
?>
<html>
<head>
<title>Welcome to Napster!</title>
<link rel="stylesheet" type="text/css" href="assets/css/register.css"/>
</head>'
My css file is in assets file which is in same file as my php file.
I am using xamp and sublime text.

it seems the issue is either browser cache or related to path..
please try
<link rel="stylesheet" type="text/css" href="assets/css/register.css?v=1.1"/>
if register.php is not in root folder then try..
<link rel="stylesheet" type="text/css" href="../assets/css/register.css?v=1.1"/>
here ?v=1.1 is added to load updated css. whenever you make changes in css file, simply chage v=1.1 with another number like v=1.2 etc... to avoid clear cache in browser and load updated css...

Related

CSS and JS won't load even when in same directory as index.php

I feel like I must be missing something very obvious, because I've never had this happen before!
I'm running a local PHP server running the following command:
php -S localhost:8888 index.php
When I go to the URL, the HTML and all the php code run just fine.
However, whenever I add a script tag to add JS in the header, I recieve the following error:
Uncaught SyntaxError: Unexcepted token <
And when I attempt to add a CSS file I get this error:
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8888/assets/style.css".
No matter whether I try and include the header by using PHP include:
<?php include("../includes/layouts/header.php"); ?>
Or directly adding a header and these imports in index.php, I always receive these errors.
My hunch was it was an issue with the directory tree. But I've even placed the CSS and JS files in the same directory as index.php and have added the header code to index.php, yet I still get these errors.
Header code
<!DOCTYPE html Public "HTML TEMPLATE">
<html lang="en">
<head>
<title>Title</title>
<link rel="stylesheet" href="style.css" media="all" title="no title" type="text/css" charset="utf-8">
<script src="script.js"></script>
</head>
<body>
<div id="header">
<h1>Header</h1>
</div>
script.js:
$( document ).ready(function() {
console.log( "ready!" );
});
Console log of errors:
Adding an image of my current project structure:
you should used / at the start of the path. as per your update question your path become /public/assets/style.css. but again i recommend you should used best way
link rel="stylesheet" href="/public/assets/style.css" media="all" title="no title" type="text/css" charset="utf-8">
<script src="/public/assets/script.js"></script>
Some more information about absolute path and relative path
If the path is built starting from the system root, it is called
absolute.
If the path is built starting from the current location, it is called
relative
The best way: you should create base url like in config.php file
define('BASE_URL', 'http://example.com');
and you can used like this
<?php
include('config.php');
?>
<link rel="stylesheet" href="<?php echo BASE_URL; ?>/styles.css" />

Moving back 2 directories not working?

Hello I am trying to move back 2 directories.
For example i have a file in my root folder ie: /root/FILE that links this stylesheet successfully with the file location being /root/blog/wp-content/themes/dazzling/inc/css/CSS-FILE.css"
<link href="blog/wp-content/themes/dazzling/inc/css/font-awesome.min.css" rel="stylesheet" type="text/css">
Now I want to link in the same stylesheet in a file located in a folder that is /root/eliquid/includes/FILE and in there and I am attempting to use
<link href="../../blog/wp-content/themes/dazzling/inc/css/font-awesome.min.css" rel="stylesheet" type="text/css">
I also attempted
<link href="../..blog/wp-content/themes/dazzling/inc/css/font-awesome.min.css" rel="stylesheet" type="text/css">
But not sure what im doing wrong! Any help is much appreciated!
Have you tried using an absolute link rather than a relative link? If your CSS file is at http://www.example.com/blog/wp-content/themes/dazzling/inc/css/font-awesome.min.css then you can include it on any page of your website as
<link href="/blog/wp-content/themes/dazzling/inc/css/font-awesome.min.css">

Website styling not being applied. (Calling stylesheet.css from a php include)

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

Linking CSS in PHP

my CSS file "styles.css" isn't loading. I'm on a mac and my PHP server is set to be loading from my "PHP" folder on my desktop.
Here is the file path to the css folder: /Users/evanbutler/Desktop/PHP/css
Code from the PHP doc:
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/Users/evanbutler/Desktop/PHP/css/styles.css">
<title>Create a Business Card</title>
Proper way is copy style.css from your desktop to project folder/css. then include css by href="css/styles.css"
They are four method to link css file into html:
Linking to a separate CSS file
<link rel="stylesheet" type="text/css" href="mystyles.css" />
Embedding CSS into the HTML
<style media="screen" type="text/css">
Add style rules here
</style>
Adding Inline CSS to HTML tags
<h2 style="color:red;background:black;">This is a red heading with a black background</h2>
Importing a CSS file from within CSS
#import "newstyles.css";
You should use a relative path to your css file from your root folder of your working project. Are you using an environment like XAMPP to test your local project on? If so, your css relative url would be a href="css/styles.css"

External Style Sheet

I've created an CSS external style sheet for a webpage of my website. I have uploaded it to the server and have used the following code in my PHP file to load the webpage. However, the webpage just loads as if it ignores the style sheet. Here's the code in the PHP file that I have used so I just uploaded the HTML tags here. Any help would be a great help. Thanks.
<html>
<head>
<link rel="styleshhet" type="text/css" href="/webspace/httpdocs/new_select3_style_sheet.css">
<script>function goBack() {window.history.back()}
</script>
</head>
<body>
<div id="main">
</div>
</body>
</html>
<link rel="styleshhet" type="text/css" href="/webspace/httpdocs/new_select3_style_sheet.css">
goes to:
<link rel="stylesheet" type="text/css" href="new_select3_style_sheet.css">
First you had a typo -> stylesheet not stylshhet second all paths run from above httpdocs in public facing HTML (where your site will be) so you need to remove everything above that! e.g.
/webspace/httpdocs/new_select3_style_sheet.css
If your domain was example.com then /webspace/httpdocs/ = example.com/ when building URLs

Categories