I have been working on converting html simple template to WordPress theme so I create folder into xampp - htdocs - wp-content - themes and I create inside this folder 8 files
footer.php , functions.php , header.php , index.php , page.php
sidebar.php , single.php , style.css
In footer file i add this code:-
</div>
<?php get_sidebar();?>
<div style="clear: both;"> </div>
</div>
</div>
</div>
<!-- end #page -->
</div>
<div id="footer">
<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by Fotogrph | Design by FreeCSSTemplates.org.</p>
</div>
<!-- end #footer -->
</body>
</html>
and in header file i add this code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title><?php bloginfo('title'); ?></title>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600' rel='stylesheet' type='text/css'>
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" type="text/css" media="screen" />
<?php wp_head(); ?>
</head>
<body>
<div id="wrapper">
<div id="header-wrapper">
<div id="header">
<div id="logo">
<h1><?php bloginfo('name'); ?></h1>
<p><?php bloginfo('description'); ?></p>
</div>
</div>
</div>
<!-- end #header -->
<div id="menu">
<?php wp_nav_menu(); ?>
</div>
<!-- end #menu -->
<div id="page">
<div id="page-bgtop">
<div id="page-bgbtm">
<div id="content">
and in index file this code
<?php get_header(); ?>
test
<?php get_footer(); ?>
I go to my admin page and find this as a theme there and I active it.
But I find it very empty and I didnt know what wrong.
If you get only blank screen then in most cases there is some misconfiguration in functions.php, do you have any code in there?
I'm not sure if it will solve your problem, but try using wp_enqueue_style() function in your functions instead of echoing your styles in header.
function theme_slug_enqueue( ){
wp_enqueue_style( 'open-sans', http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600' );
wp_enqueue_style( 'main-style', get_stylesheet_directory_uri() . 'style.css' );
}
Put that in your functions.php, and delete elements from your header.
bloginfo('stylesheet_url') function only gets your main directory url, you are not calling your mains style.css anywhere as I can see. If you don't want to use wordpress standard enqueue function at least try changing
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet" type="text/css" media="screen" />
to:
<link href="<?php bloginfo('stylesheet_url') . 'style.css'; ?>" rel="stylesheet" type="text/css" media="screen" />
refference: https://codex.wordpress.org/Function_Reference/wp_enqueue_style
Wordpress theme required atleast two files to work so first check your theme by including only two files in your theme folder
wp-content/themes/mytheme/
style.css
index.php
add these lines in your style.css file
/*
Theme Name: My theme
Version: 1.0
*/
and add these line in your index.php file
this is theme testing
then run your wordpress website and check
Well you have to create a new folder inside the theme folder. SO it should look like this
wp-content
themes
Theme-name (lets say bruno)
header.php
footer.php
index.php
style.css
Now in style.css, its important that you add these comments.
/*
Theme Name: Bruno theme
Theme URI: Your site
Author: Your name
Author URI: http://yoursite.org/
Description: Some description
Version: 1.0
*/
These comments will tell wordpress all the information about your theme
Related
Okay. I've been trying to link the css stylesheets to my webpages. I've been scratching my head trying to figure out what I am doing wrong. Any ideas?
functions.php
<?php
function roofers_wp_resources() {
wp_enqueue_style('normalize', get_stylesheet_uri());
wp_enqueue_style('style', get_stylesheet_uri());
}
add_action('wp_enqueue_scripts', 'roofers_wp_resources');
?>
header.php
<!DOCTYPE html>
<html>
<head>
<title>R.J Roofers</title>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<?php wp_head(); ?>
</head>
<body>
front-page.php
<?php get_header(); ?>
<div class="main-container">
<header class="main-header">
<!-- <h1 class="logo-name"><li>R.J Roofer</li></h1>
--> <h1 class="logo-name">R.J Roofer</h1>
<nav class="main-nav">
<li class="nav-item-1">home</li>
<li>services</li>
<li>gallery</li>
<li>about us</li>
<li>contact</li>
</nav>
</header>
<div class="quote-box-1">
<div class="quote-box">
<p class="quote-box-title">HOME ROOFING BRISBANE NO.1 FOR ROOF RESTORATIONS AND ROOF REPLACE</p>
<button class="quote-btn-1">BOOK A FREE QUOTE</button>
</div>
</div>
More Code..
get_stylesheet_uri() gives full url to your style.css file, so in your case it's good only if you want to enqueue the style.css file.
For the second file, you need to pass a full url including the name of the file.
Assuming your normalize file called normalize.css:
function roofers_wp_resources(){
wp_enqueue_style('my-theme-style', get_stylesheet_uri());
wp_enqueue_style('normalize', get_template_directory_uri() . '/normalize.css');
}
add_action('wp_enqueue_scripts', 'roofers_wp_resources');
Notice that if you working on a child theme, you need to change get_template_directory_uri() to get_stylesheet_directory_uri().
Im having problem with my wordpress. i have downloaded wordpress 4.3 and run it on xampp.
im trying to make my own theme in wordpress so i made a folder in wordpress\wp-content\themes.
i made my style.css, header, footer, index.php but whenever i run it, im having this error on top.
array_merge(): Argument #2 is not an array in C:\xampp\htdocs\wordpress\wp-includes\nav-menu.php on line 93
here is my header.php
<!DOCTYPE html>
<html>
<head>
<title>
<?php
wp_title('|', 'true', 'right'); // title of the page
bloginfo('name'); // name of the blog
?>
</title>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/style.css">
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url');?>/bootstrap.css">
<?php wp_head(); //this is use for plugins ?>
</head>
<body>
<div class="container">
<div class="five columns clearfix">
<img src="<?php bloginfo('template_url');?>/img/globelogo.jpeg" title="bloginfo('title');">
</div>
</div>
</body>
</html>
here is my index.php
<?php get_header(); ?>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
what seems to be the problem?
I been creating a template from scratch in wordpress and now I have a template header with a image in it a text/ subheader text. And below that all some info text. What I want is that I can change that info text like a page or custom field in the backhand of wordpress.
This text as example I want to edit in the backhand : CUSTOM HEADER TEXT
see the code below:
<!doctype html>
<!--[if IE 8]> <html class="no-js lt-ie9" lang="nl" > <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="nl" > <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title><?php echo wp_title(' | ', false, 'right') . get_bloginfo(); ?></title>
<?php wp_head(); ?>
</head>
<body>
<header>
<div class="row">
<div class="large-12 columns">
<div class="large-12 columns">
<h1><?php bloginfo('name'); ?> <span class="description">| <?php bloginfo('description'); ?></span></h1>
</div>
<p>CUSTOM HEADER TEXT</p>
</div>
</div>
</div>
</header>
Just go to admin => Appearance => Widgets, Drag a text widget in any of your sidebar and put the text "CUSTOM HEADER TEXT" in the text widget and save it.
After that just go to your header file where you want to show this text and put this code snippet : <?php dynamic_sidebar( 'sidebar-1' ); ?> //here 1 is the id of your sidebar
Just check in front end, you will find the text but layout is a little different. To do this pixel perfect, go to your function.php file and search for your sidebar like "sidebar-1" and remove the extra divs from there.
Follow the above steps, you'll get what you want.
How can I hide a div (which contains an image) for a specific WordPress page?
I believe my page id is 46:
Here is the div I am trying to change:
<div id="static-footer-image" style="position:absolute; bottom: -15px; z-index: 501;">
<img src="images/background-bottom.png"/>
</div>
And the associated CSS code in my main CSS file:
body.page-id-46 #static-footer-image{
display: none;
}
If I remove the body.page-id-46, it is correctly being hidden on all pages, so it must have something to do with this part of the code.
#static-footer-image{
display: none;
}
Attached is the PHP for the header.php which so it's on every page...
<body class="<?php hybrid_body_class(); ?>">
What am I doing wrong?
EDIT: because this is a wordpress page there is a lot of PHP embedded but here is the is the associated HTML/PHP:
<?php
/**
* Header Template
*
* The header template is generally used on every page of your site. Nearly all other
* templates call it somewhere near the top of the file. It is used mostly as an opening
* wrapper, which is closed with the footer.php file. It also executes key functions needed
* by the theme, child themes, and plugins.
*
* #package Hybrid
* #subpackage Template
*/
?>
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta http-equiv="Content-Type" content="<?php bloginfo( 'html_type' ); ?>; charset=<?php bloginfo( 'charset' ); ?>" />
<title><?php hybrid_document_title(); ?></title>
<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" type="text/css" media="all" />
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<!-- Add jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<!-- Add mousewheel plugin (this is optional)
<script type="text/javascript" src="/lib/jquery.mousewheel-3.0.6.pack.js"></script>
-->
<script src="<?php bloginfo('stylesheet_directory'); ?>/lib/jquery.mousewheel-3.0.6.pack.js" type="text/javascript"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.fancybox.css?v=2.0.6" type="text/css" media="screen" />
<!--<script type="text/javascript" src="/js/jquery.fancybox.pack.js?v=2.0.6"></script>-->
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/jquery.fancybox.pack.js?v=2.0.6" type="text/javascript"></script>
<!-- Optionally add helpers - button, thumbnail and/or media -->
<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/js/helpers/jquery.fancybox-buttons.css?v=1.0.2" type="text/css" media="screen" />
<!--
<script type="text/javascript" src="/js/helpers/jquery.fancybox-buttons.js?v=1.0.2"></script>
<script type="text/javascript" src="/js/helpers/jquery.fancybox-media.js?v=1.0.0"></script>
-->
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/helpers/jquery.fancybox-buttons.js?v=1.0.2" type="text/javascript"></script>
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/helpers/jquery.fancybox-media.js?v=1.0.0" type="text/javascript"></script>
<link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/js/helpers/jquery.fancybox-thumbs.css?v=2.0.6" type="text/css" media="screen" />
<!--<script type="text/javascript" src="/js/helpers/jquery.fancybox-thumbs.js?v=2.0.6"></script>-->
<script src="<?php bloginfo('stylesheet_directory'); ?>/js/helpers/jquery.fancybox-thumbs.js?v=2.0.6" type="text/javascript"></script>
<?php do_atomic( 'head' ); // #deprecated 0.9.0. Use 'wp_head'. ?>
<?php wp_head(); // wp_head ?>
</head>
<body class="<?php hybrid_body_class(); ?>">
<?php do_atomic( 'before_html' ); // hybrid_before_html ?>
<div id="body-container">
<?php do_atomic( 'before_header' ); // hybrid_before_header ?>
<div id="header-container">
<div id="header">
<?php do_atomic( 'header' ); // hybrid_header ?>
</div><!-- #header -->
</div><!-- #header-container -->
<?php do_atomic( 'after_header' ); // hybrid_after_header ?>
<div id="homepage-container"> <!--id="uway-container"> -->
<div id="uway-container"> <!--id="homepage-container"> --> </div>
<div id="container">
<?php do_atomic( 'before_container' ); // hybrid_before_container ?>
<?php
/**
* Footer Template
*
* The footer template is generally used on every page of your site. Nearly all other
* templates call it somewhere near the bottom of the file. It is used mostly as a closing
* wrapper, which is opened with the header.php file. It also executes key functions needed
* by the theme, child themes, and plugins.
*
* #package Hybrid
* #subpackage Template
*/
?>
<?php do_atomic( 'after_container' ); // hybrid_after_container ?>
</div><!-- #container -->
<div id="static-footer-image" style="position:absolute; bottom: -15px; z-index: 501;">
<img src="http://www.unitedway.zhi.com/wp-content/themes/hybrid-uway/images/background-bottom.png"/>
</div>
<!-- </div> id="homepage-container"> -->
</div> <!--id="uway-container"> -->
<div id="footer-container">
<?php do_atomic( 'before_footer' ); // hybrid_before_footer ?>
<div id="footer">
<?php do_atomic( 'footer' ); // hybrid_footer ?>
</div><!-- #footer -->
<?php do_atomic( 'after_footer' ); // hybrid_after_footer ?>
</div><!-- #footer-container -->
</div><!-- #body-container -->
<?php do_atomic( 'after_html' ); // hybrid_after_html ?>
<?php wp_footer(); // wp_footer ?>
</body>
</html>
You don't need to use the body declaration.
try:
.page-46 #static-footer-image {
display:none;
}
You could also hide this via PHP in the template files, but that may be more trouble that it is worth, no? Can also add code for that if you would like.
EDIT: the PHP (for wordpress)... should work. I would say go for the CSS, though. Not really necessary to go digging through the Wordpress files.
<?php if( !is_page('XXX') ):?>
the code to display this div goes here.
<?php endif;?>
It'd help to have a link to the page or a more detailed example of its HTML source, but what seems probable is that the element you want to hide isn't a direct child of the body element, in which case the selector given in your CSS excerpt won't address it properly. Instead, try:
body.page-id-46 * #static-footer-image {
display: none;
}
which will address an element of ID static-footer-image which is anywhere under the body element, instead of having to be a direct descendant (i.e., <body>...<div id="static-footer-image"></div>...</body>).
I`m writing an answer because I cant comment yet.
Try this:
.page-id-48 #static-footer-image{ display:none; }
The following CSS rule will hide all divs which have class name starting from page-id-:
div[class^="page-id-"] {
display: none;
}
This could be a useful answer if your id changes all the time and you don't have other divs with such class names. However, it is impossible to define in CSS something like 50 < id < 67
i added
<style>
#sideshoppingcart {display: none;}
</style>
to the shopping cart page via editor
This works for me, I had a Carrie Dils' utility bar and needed to hide it.
I added this to my style.css and it worked and the page whose ID is 2:
body.page-id-2 .utility-bar {
display: none;
}
I am a complete Yii newbie so please forgive a simple question. I've been reading up on various posts and can't find anything that works. All I'm trying to do is setup a Yii site (which I've done) and then link to a static page using my Main layout.
Below are the three files I think are relevant:
index.php: the view I show on my homepage as content with the main layout
terms_of_use.php: the view I'm unsuccessfully trying to get to appear in the main layout
main.php: my master layout
Within the footer of the main layout, the link to the static page is:
Terms of Use
When I click on it, it generates what I think is the correct url in the brower address bar:
http://localhost/Company/index.php?r=site/page&view=terms_of_use
but what gets shown is the content of index.php, not terms_of_use.php. I'm using the default SiteController. Is there something special about index.php I don't know about, or am I doing something else dumb? Thanks for any help.
views/site/index.php:
<?php
/* #var $this SiteController */
$this->pageTitle=Yii::app()->name;
?>
<div id="content" class = "clearfix">
<div class="threeColBlock">
<div class="padded">
<h2 class="pageTitle">Heading 1</h2>
<p>Blurb 1</p>
</div>
</div>
<div class="threeColBlock">
<div class="padded">
<h2 class="pageTitle">Heading 2</h2>
<p>Blurb 2</p>
</div>
</div>
<div class="threeColBlock">
<div class="padded">
<h2 class="pageTitle">Heading 3</h2>
<p>Blurb 3</p>
</div>
</div>
</div>
views/site/pages/terms_of_use.php:
<?php
/* #var $this SiteController */
$this->pageTitle=Yii::app()->name . ' - About';
$this->breadcrumbs=array(
'About',
);
?>
<div id="content" class = "clearfix">
<h2 class="pageTitle">Terms of Use</h2>
<div class = "smallText">
<p>
Some legal junk
</p>
</div>
</div>
views/layouts/views/main.php:
<?php /* #var $this Controller */ ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="en" />
<!-- blueprint CSS framework -->
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/screen.css" media="screen, projection" />
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/print.css" media="print" />
<!--[if lt IE 8]>
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/ie.css" media="screen, projection" />
<![endif]-->
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/main.css" />
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/form.css" />
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/marketing.css">
<link rel="stylesheet" type="text/css" href="<?php echo Yii::app()->request->baseUrl; ?>/css/cssmenu.css" media="screen" />
<title><?php echo CHtml::encode($this->pageTitle); ?></title>
</head>
<body>
<div id="header" class="clearfix">
<div id="logo"><image src="images/logo,56x38,trans(white).gif"></div>
<div id="logoName">Company</div>
<div id="topRight">Bla bla bla</b></div>
</div>
<!-- Menu -->
<div id='cssmenu'>
<ul>
<li class='active'><a href='dummy.com'><span>home</span></a></li>
<li class='has-sub'><a href='#'><span>products</span></a>
<ul>
<li><a href='dummy.com'><span>prod1</span></a></li>
<li><a href='dummy.com'><span>prod2</span></a></li>
<li class='last'><a href='dummy.com'><span>prod3</span></a></li>
</ul>
</li>
<li><a href='dummy.com'><span>about</span></a></li>
<li class='last'><a href='dummy.com'><span>contact</span></a></li>
</ul>
</div>
<div id="mainImageContainer">
<div id="mainImage">
<image src = "images/main_image.jpg">
</div>
</div>
<?php echo $content; ?>
</div><!-- page -->
<div id="footer">
Copyright © 2011 Company. All rights reserved. | Terms of Use
</div>
</body>
</body>
</html>
Found it. I had enabled the urlManager in config/main.php. If I change my original link to the following then I get what I want.
http://localhost/Company/index.php/site/page/view/terms_of_use
In regards to your specific question, I believe you may have forgotten the step of overriding the actions() method in the default site controller - though that raises the question: Which version of the Yii framework are you using? The override is already included in Yii 1.1.12.
Also, as per the comments on that yii wiki article:
If you happen to use accessRules, don't forget to add 'page' (or
whatever name you have in) to allowed action as well.
http://www.yiiframework.com/wiki/22/how-to-display-static-pages-in-yii/ is a great post on using static pages in Yii, the bulk of it:
First, in the default SiteController (or other controller if you
like), override the actions() method as follows,
public function actions()
{
return array(
'page'=>array(
'class'=>'CViewAction',
),
);
}
Second, create a folder protected/views/site/pages.
Third, save each static page as a PHP file under this folder. For
example, we can save the "about this site" page as about.php. Note,
these pages will use the application's default layout. Therefore, only
the main content needs to be saved in each file.
We are done! To access a static page, e.g., the about page, we can use
the following URL:
http://www.example.com/index.php?r=site/page&view=about
Try not to hardcode urls, instead use functions like createUrl, (there are other variants of it).
When you hardcode urls the problem you faced could arise, createUrl takes into account your urlManager configuration, and generates a url accordingly, so when you make changes you don't have to go to every view and change the url again.
You can use it like so:
About
Or use CHtml::link:
echo CHtml::link('About',array('/site/page', 'view'=>'temrs_of_use'));