I have a zend framework application up and running. I have created a layout. Now I need to include bootstrap css file to my layout.
I tried with 'baseUrl' but it didn't work. I have the css files inside 'public/assets/css'.
I also tried with tutorial in zend framework website. But it didn't work.
They mentioned to use
<?php echo $this->headLink()->appendStylesheet('/assets/css/bootstrap.css') ?>
I added the above line in layout page but it didn't work.
Also for your information when I use this headlink, in console it's showing as
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8010/assets/css/bootstrap.css".
Any help is greatly appreciated. Thanks in advance.
Head Tag:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Zend Framework Quickstart Application</title>
<link href="/assets/css/bootstrap.css" media="screen" rel="stylesheet" type="text/css">
</head>
Extra information: I have a controller 'HomeController' in it I have defined an action
public function homeTwoAction()
{
// action body
$this->_helper->layout->setLayout('layout');
}
In views -> I have home-two.phtml inside 'scripts/home'.
In layout I have the following code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Bootstrap</title>
<!-- <link rel="stylesheet" href="style/bootstrap.min.css">-->
<!-- <link rel="stylesheet" href="style/customstyle.css">-->
<!--<link type="text/css" rel="stylesheet" href="/assets/css/customstyle.css">-->
<?= $this->headLink()->appendStylesheet('/assets/css/customstyle.css') ?>
<?= $this->headLink()->appendStylesheet('/assets/css/bootstrap.min.css') ?>
</head>
<body>
<div class="container-fluid">
<?php echo $this->layout()->content ?>
</div>
</body>
</html>
I am accessing
http://localhost:8010/home/home-two
HTML content is loaded but css not loading. Thanks.
Changing Mime type is explained here
Go to Tools -> Options
Then under Miscellaneous tab choose the file type css and make sure the Associated File Type is text/css
Edit
Try opening http://localhost:8010/assets/css/ or http://localhost:8010/assets/ what do you see?
Related
...
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8">
<title>**********</title>
<link href="css/main.css" rel="stylesheet" />
<link href="css/home.css" rel="stylesheet" />
</head>
<body>
<?php
// top navigation
require_once("require/top_navigation.php");
// header
require_once("require/header.php");
// main
require_once("require/main.php");
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="js/main.js"></script>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_GB/sdk.js#xfbml=1&version=v5.0&appId=411386782258918&autoLogAppEvents=1"></script>
</body>
</html>
...
I haven't done much direct php for a while, but when I seem to use the require_once it adds a blank text element followed by 1. I've looked all over google and everyone that I've come across says it's because of BOM. So I checked on the editor that I use 'Visual Studio Code', and it's not enabled, by default it's UTF-8 without BOM.
The apache software is Xampp.
This is how I have used the link tag inside the Head tag. But it is not working. Please help me to solve this.
<head>
<meta charset="UTF-8">
<link href="ccc.css" rel="stylesheet" type="text/css">
<title></title>
</head>
Both the CSS and php files are in the same folder.
I'm trying to add the following code
<!DOCTYPE html>
<html version="HTML+RDFa 1.0">
<head>
<meta charset="utf-8" />
<meta content="width=device-width, height=device-height, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport" />
<link href="https://socialhub.s3.amazonaws.com/production/styles/sr-socialhub.carousel.default.css" rel="stylesheet" />
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<!-- Note - you may not need to include jQuery if you already have it. -->
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="https://socialhub.s3.amazonaws.com/production/scripts/app-carousel.min.js"></script>
</head>
<body>
<div ng-app="ngSocialHub" ui-view
ng-social-hub-carousel
ng-social-hub-customer="news"
ng-social-hub-board-id="out-and-about"
ng-social-hub-infinite-scroll="true"
ng-social-hub-dialog-enabled="false"
ng-social-hub-locale="en"
ng-social-hub-facebook-appid="<YOUR FACEBOOK APP ID HERE>"
ng-social-hub-interval="5000"
ng-social-hub-disable-user-actions="false"
ng-social-hub-disable-carousel-indicator="true"
></div>
</body>
</html>
into a page as inline code to my site http://dtcm.co.nz, for some reason this code doesn't seem to work with my wordpress based site, I have also tried it on another wordpress site which has no plug ins and it did not work. The company who provided the code have had success with wordpress sites, however sometimes have come into problems. will there be anything that will be restricting my wordpress from allowing this inline code to work?
I've added the code
<meta name="viewport" content="width=device-width, initial-scale=1" />
to the HEAD of my webpage the Index.php at DuchyBrass.co.uk
It is on Line 6 of the source code, but the site runs on a bespoke CMS so the HEAD is defined in its own file and imported.
index.php
<!DOCTYPE html>
<html lang='en'>
<head>
<?php include 'app/common/head.php'; ?>
</head>
<body>
...
head.php
<title>Duchy Brass</title>
<meta charset="windows-1252" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="google-site-verification" content="QsU348JA47VLcAbTUic-Un90bVlGuVk3a9A34doxsvc" />
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Viga' rel='stylesheet' type='text/css'>
<link rel="icon" type="image/png" href="imgs/favicon.ico">
<link rel="canonical" href="http://www.duchybrass.co.uk" />
As far as the browser is concerned (I assume) that viewport tag is visible, but it is not seen by that Mobile SEO tool. Is this something to do with the CMS, loading the information too late, or is this a common issue that I should ignore?
The top of my Index page (using view page source from the browser) looks like
/ (page source)
<!DOCTYPE html>
<html lang='en'>
<head>
<title>Duchy Brass</title>
<meta charset="windows-1252" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
...
TL;DR: clear caches and check if there is no content before head (ctrl+U)
I had a similar problem, in my case there were content being included trough PHP before my wordpress header call,
check it with Ctrl+U (see source) and be sure there is nothing before the
<!DOCTYPE html>
<html lang='en'>
<head>
if you change the code and it persists, check if you're using cache, you may have to clear caches of pages and files so the changes take effect before running another PageSpeed analysis
I am new to HTML and hope someone can help me with this.
I am trying to set up a website where the code for every page is saved as a separate php file.
Since all these pages use the same document head and includes I would like to remove as much as possible of this from the pages and save it in a separate includes file (header.php) which I can then include using PHP.
My current head looks as follows and since this is the same on all pages I currently have ALL this saved in the separate header.php file and then just use <?php include "header.php"; ?> on the single pages.
Can someone tell me which parts of this should remain on the single pages for a proper setup and if anything should be changed or added here ?
Note: jQuery and JS are included separately in the footer.
My PHP (header file):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="author" content="John Doe" />
<meta name="description" content="Created: 2015-06" />
<base href="http://www.MyURL.com" target="_self" />
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="includes/styles.css" />
<!-- CSS - Font Awesome -->
<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
<title>My Page</title>
</head>
<body>
<div class="wrapper">
<!-- ... -->
Your Top head file (top_head.php):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<?php if(isset($page_author)){ ?>
<meta name="author" content="<?php echo $page_author; ?>" />
<?php } ?>
<?php if(isset($page_description)){ ?>
<meta name="description" content="Created: 2015-06" />
<?php } ?>
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="includes/styles.css" />
<!-- CSS - Font Awesome -->
<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
<title><?php echo $page_title; ?></title>
Your current header file:
<?php
$page_title = 'Hello';
$page_description = 'This is a beautiful description';
?>
<?php include("top_head.php"); ?>
</head>
<body>
<div class="wrapper">
<!-- ... -->
Since you are starting your tag in header.php, you can close the tag on the own page itself (i mean the other pages ie: Contact, About Us, Product, etc...).
The code section you have mentioned in the question can be called as header.php and further can be included on each and every page where it is required.
Apart from this
Header - header.php
Main content - main-content.php - this will be specific to each and every page from your website
Footer - footer.php - this can also be made common - and further included in every page.
Apart from this you can also have a few more php files which might have navigation or any kind of common content blocks.
Example page could be:
<?php
include 'header.php'
/*either add here the content or include further php files*/
include 'about-us.php'
include 'footer.php'
?>
You are doing right, the parts that are shared between all the pages should be placed in a separate php file, this greatly improve your life when you have to maintain the site (immagine add a stylesheet or a library to every page of your site after some time ...).
To help SEO you should specify a title and maybe some meta tag that are page specific.
Also consider carefully if you have other parts that are repeated in every page for example a left or right bar or a particular widget (for example a banner image or something like that)
This should give you the general idea...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="author" content="John Doe" />
<meta name="description" content="Created: 2015-06" />
<base href="http://www.MyURL.com" target="_self" />
<!--
Your paths need to relative to the websites root directory or the full
URL else they may not work depending on where the file is located.
-->
<link rel="stylesheet" type="text/css" href="/includes/styles.css" />
<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" />
<!--
This line just echos the title if one has been set or a default string
if the title hasn't been set. You will need to ensure every page that
includes this file sets the title before including this file. You may
also want to take this approach with other values.
-->
<title><?php echo isset($title) ? $title : 'Default Title'; ?></title>
</head>
<body>
<div class="wrapper">