shwetapandit Posted December 8, 2013 Share Posted December 8, 2013 where to link and how to link style.css in my custom page template in wordpress.plz reply Quote Link to comment https://forums.phpfreaks.com/topic/284616-where-to-link-css-in-wordpress-custom-page-in-wordpress/ Share on other sites More sharing options...
QuickOldCar Posted December 8, 2013 Share Posted December 8, 2013 Can make a child theme and make any changes there, not usually a good idea to edit the original one. http://codex.wordpress.org/Child_Themes You can also just use <style></style> tags for each custom page Or even something like this I'm using custompage as the page name <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" /> <?php if(is_page_template('custompage.php')) :?> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/custompage.css" media="screen" /> <?php endif;?> Quote Link to comment https://forums.phpfreaks.com/topic/284616-where-to-link-css-in-wordpress-custom-page-in-wordpress/#findComment-1461630 Share on other sites More sharing options...
shwetapandit Posted December 8, 2013 Author Share Posted December 8, 2013 Can make a child theme and make any changes there, not usually a good idea to edit the original one. http://codex.wordpress.org/Child_Themes You can also just use <style></style> tags for each custom page Or even something like this I'm using custompage as the page name <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" /> <?php if(is_page_template('custompage.php')) :?> <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/custompage.css" media="screen" /> <?php endif;?> Quote Link to comment https://forums.phpfreaks.com/topic/284616-where-to-link-css-in-wordpress-custom-page-in-wordpress/#findComment-1461657 Share on other sites More sharing options...
shwetapandit Posted December 8, 2013 Author Share Posted December 8, 2013 hi..... As i am newbie to wordpress.i may be wrong.but can't find.Below is my files: cutom_page.php <!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"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><style type='css'><link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" /><?php if(is_page_template('custom_page.php')) :?><link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/style.css" media="screen" /><?php endif;?></style></head><body><?php/** * Template Name:Custom Page * The main template file * * This is the most generic template file in a WordPress theme and one of the * two required files for a theme (the other being style.css). * It is used to display a page when nothing more specific matches a query. * For example, it puts together the home page when no home.php file exists. * * @link http://codex.wordpress.org/Template_Hierarchy * * @package WordPress * @subpackage Twenty_Thirteen * @since Twenty Thirteen 1.0 */?> <div id="container"><div id="header"><h1>Main Title of Web Page</h1></div><div id="menu"><b>Menu</b><br>HTML<br>CSS<br>JavaScript</div><div id="content">Content goes here</div><div id="footer">Copyright©</div></div> </body></html> style.css /* CSS Document *//* Theme Name: Demo Theme URI: http://example.com/Demo/ Description: Demo Author: John Doe Author URI: http://example.com Version: 1.0.0 * ---------------------------------------------------------------------------- */h1{color:#00FF99;background-color:#00FF66;font:Verdana, Arial, Helvetica, sans-serif;font-size:16px;}p{color:#FFFF33;background-color:#CCCCCC;}#footer{ background-color:#FFA500; clear:both; text-align:center; } #main{ width:1000px; height:1000px; } #header{ background-color:#FFA500; height:100px; } #menu{ background-color:#FFD700; height:800px; width:200px; float:left; } #content{ background-color:#EEEEEE; height:800px; width:800px; float:left; } header.php <?php/** * The Header template for our theme * * Displays all of the <head> section and everything up till <div id="main"> * * @package WordPress * @subpackage Twenty_Thirteen * @since Twenty Thirteen 1.0 */?><!DOCTYPE html><!--[if IE 7]><html class="ie ie7" <?php language_attributes(); ?>><![endif]--><!--[if IE 8]><html class="ie ie8" <?php language_attributes(); ?>><![endif]--><!--[if !(IE 7) | !(IE ]><!--><html <?php language_attributes(); ?>><!--<![endif]--><head> <meta charset="<?php bloginfo( 'charset' ); ?>"> <meta name="viewport" content="width=device-width"> <title><?php wp_title( '|', true, 'right' ); ?></title> <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" media="screen" /><?php if(is_page_template('custom_page.php')) :?><link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/style.css" media="screen" /><?php endif;?> <!--[if lt IE 9]> <script src="<?php echo get_template_directory_uri(); ?>/js/html5.js"></script> <![endif]--> <?php wp_head(); ?></head><body <?php body_class(); ?>> <div id="page" class="hfeed site"> <header id="masthead" class="site-header" role="banner"> <a class="home-link" href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"> <h1 class="site-title"><?php bloginfo( 'name' ); ?></h1> <h2 class="site-description"><?php bloginfo( 'description' ); ?></h2> </a> <div id="navbar" class="navbar"> <nav id="site-navigation" class="navigation main-navigation" role="navigation"> <h3 class="menu-toggle"><?php _e( 'Menu', 'twentythirteen' ); ?></h3> <a class="screen-reader-text skip-link" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentythirteen' ); ?>"><?php _e( 'Skip to content', 'twentythirteen' ); ?></a> <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?> <?php get_search_form(); ?> </nav><!-- #site-navigation --> </div><!-- #navbar --> </header><!-- #masthead --> <div id="main" class="site-main"> Where i am wrong plz suggest.Thanks in advance........... Quote Link to comment https://forums.phpfreaks.com/topic/284616-where-to-link-css-in-wordpress-custom-page-in-wordpress/#findComment-1461659 Share on other sites More sharing options...
QuickOldCar Posted December 8, 2013 Share Posted December 8, 2013 (edited) Ok, lets make sure you are going about this correct. I see you are using Twenty Thirteen template, browse to that theme folder and make a new file called custompage.php Paste this within and save it: <?php /* Template Name: CustomPage */ ?> <?php get_header(); ?> <style> <!-- div.newcontent { width: 80%; background:#000000; color:#DF0101; text-decoration: none; text-align:center; margin-top:0px; margin-bottom:0px; margin-right: auto; margin-left: auto; padding:0px; } --> </style> <?php echo "<div class='newcontent'>"; echo "Any code gets added this area"; echo "</div>"; ?> <?php get_footer(); ?> Go to your dashboard Create a new page and name it what you desire At the bottom right under "Page Attributes" select the "CustomPage" under "Template" Publish your page Edited December 8, 2013 by QuickOldCar Quote Link to comment https://forums.phpfreaks.com/topic/284616-where-to-link-css-in-wordpress-custom-page-in-wordpress/#findComment-1461672 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.