I'm working on a WordPress site. The Roots theme was installed by someone else. I want to code pages as directly as possible without using Bootstrap. I don't completely understand WordPress, but it looks to me like base.php is code that wraps every page. I'm wondering how much of this I can change without messing up the theme. Mainly I don't want to use Bootstrap. Can I just remove the references to the 'container' and 'row' classes? By the way, what are the 'wrap' and 'content' and 'main' classes? How do I find out what roots_main_class() is? Is there another way to do this, like not loading bootstrap.css?
<?php get_template_part('templates/head'); ?>
<body <?php body_class(); ?>>
<!--[if lt IE 7]><div class="alert"><?php _e('You are using an <strong>outdated</strong> browser. Please upgrade your browser to improve your experience.', 'roots'); ?></div><![endif]-->
<?php
do_action('get_header');
// Use Bootstrap's navbar if enabled in config.php
if (current_theme_supports('bootstrap-top-navbar')) {
get_template_part('templates/header-top-navbar');
} else {
get_template_part('templates/header');
}
?>
<div class="wrap container" role="document">
<div class="content row">
<div class="main <?php echo roots_main_class(); ?>" role="main">
<?php include roots_template_path(); ?>
</div><!-- /.main -->
<?php if (roots_display_sidebar()) : ?>
<aside class="sidebar <?php echo roots_sidebar_class(); ?>" role="complementary">
<?php include roots_sidebar_path(); ?>
</aside><!-- /.sidebar -->
<?php endif; ?>
</div><!-- /.content -->
</div><!-- /.wrap -->
<?php get_template_part('templates/footer'); ?>
</body>
</html>
Your question is trying to cover a lot of different points. A couple of observations:
If you don't completely understand Wordpress then I would strongly recommend you familiarise yourself with the WP documentation first.
Bootstrap is a framework; why don't you just build on top of it and use it as a starting point?
If you really don't want to use Bootstrap then it would be a lot simpler to switch to a different theme
Looking at the roots theme, there isn't bootstrap.css; there's main.min.css. You can either: A) edit that directly, B) prevent it from loading by commenting out line 14 of lib/scripts.php and enqueuing your own CSS or C) leave it as is and load your own CSS as an additional stylesheet by enqueuing it in 'lib/scripts.php`. To understand how to enqueue stylesheets in WP, refer to the WP Codex entry for wp_enqueue_style.
I'd strongly consider rethinking your question so that it is easier to answer, and maybe posting it as separate questions rather than one multi-faceted question.
Related
I'm using the <!--nextpage--> function to page break and split the page on Wordpress.
The problem is, whenever <!--nextpage--> is inserted, the position of sidebar is moved to where it shouldn't be.
It's like this on page.php:
<div class="main">
<?php
if (have_posts()) :
...
?>
<?php wp_link_pages(); ?>
</div>
<?php get_sidebar(); ?>
So if I understand correctly, .main and get_sidebar are on the same level.
But when I actually make some page using this template, an output is like this:
<div class="main">
<div class="section">
...
<div class="content">
// pagination is inserted here
</div>
<aside class="sidebar">
...
</aside>
</div>
</div>
In other words, get_sidebar(aside tag) automatically moves into .section.
This is extremely confusing to me, and really don't know what to do here.
Why does Wordpress decide to put it inside of .section? Why can't it be faithful to the template?
Now the sidebar is positioned at the end of content instead of being on the right side.
What are the possible causes and solution to this issue?
Thank you for reading.
Is there a way to only display a parent (wrapping) if it's actually been populated with content?
The reason I ask is in Wordpress I'm using Advanced Custom Fields to create additional text areas on the homepage of the website. The content is added to the page inside divs, like this:
<section class="band">
<div class="wrap">
<?php the_field('services'); ?>
</div>
</section>
If the field is left blank, obviously the markup that surrounds remains on the page and due to the margin/padding they have set on them it leaves a big empty stripe across the page.
I know little Wordpress (and PHP in general), I assume this must be possible? I've had a play around with if/else statements but had no luck.
Can anyone advise on this?
You could do it this way:
<?php if( get_field('services') ) : ?>
<section class="band">
<div class="wrap">
<?php the_field('services'); ?>
</div>
</section>
<?php endif; ?>
I have a website that I am trying to edit, but only have it available on my localhost WAMP server, so I can not link to the site. The footer has wording that I would like to change, but my footer file only shows the following:
<?php PC_Hooks::pc_after_opening_footer_tag(); /* Framework hook wrapper */ ?>
<?php get_sidebar( 'footer' ); // Adds support for the four footer widget areas ?>
<?php PC_Hooks::pc_before_closing_footer_tag(); /* Framework hook wrapper */ ?>
</footer>
</div><!-- #body-container -->
<?php PC_Hooks::pc_after_closing_footer_tag(); /* Framework hook wrapper */ ?>
<?php wp_footer(); ?>
</body>
</html>
I do not know where to find the file that I need to change. I have litterally gone through every file and can not find where it determines what it shows in the footer. I am not completely familiar with PHP, but can generally figure out at least which file needs to be edited. Can anyone help me understand where I might be able to find the file to edit to change the wording in my footer??
For most of my projects I make an administration interface, which has the same design for every project. The design of the header, the footer, the topbar, the leftmenu, the css, etc. are always the same. It is a pity to create the views every time; so I was thinking: maybe there would be a nice way to put the admin interface in my MVC library, as it is reused by every project?
But for the moment, in every single view I got code like the following:
<?php $this->_include('/includes/doctype.php'); ?>
<head>
<?php $this->_include('/includes/head.php'); ?>
<title>Some title</title>
</head>
<body>
<?php $this->_include('/includes/topbar.php'); ?>
<div id="page">
<?php $this->_include('/includes/header.php'); ?>
<?php $this->_include('/includes/leftmenu.php'); ?>
<div id="content" role="main">
<h1>Some title</h1>
<p>Blah blah blah.</p>
</div><!-- /#content -->
<?php $this->_include('/includes/footer.php'); ?>
</div><!-- /#page -->
</body>
</html>
Would it be a good idea to extract the custom content from the structure of the interface, and put that structure in my library somehow to make it reusable?
After that how will it be possible to customize the title and the actual menus?
I do this all the time. I have a custom header and footer file that are called at the start and end of every page.
<?PHP
Require("includes/header.php");
...
Require("includes/footer.php");
?>
The header provides a database handle, a datetime string and handles logon, priveleges, logging of pageviews etc.
The footer provides a standard HTML page but includes some systematised variables. It also generates the menu dynamically from the driving database then closes the database connection.
This way when I write code, I don't get mixed up in the HTML and any bugs are easy to find.
I like variables akin to:
$display_scripts - adds extra data in the head section.
$display_onload_scripts - adds onload scripts to body section.
$display_style_sheets - option to include link to additional stylesheets
$display_above_menu - will appear above the menubar. NOT recommended.
$display_below_menu - will appear immediately below the menubar.
$display_one_column - page contents when only one column is to be used
$display_left_column - page contents when two columns used. Left pane.
$display_right_column - page contents when two columns used. Right pane.
$display_footer - appears in footer division.
My main code then just has to generate the appropriate variable. Fundamentally, what you need to do is examine the source of a good age you have produced then replace the stuff you want to change with variables.
Here is a schematised version of the file I use (pseudocode) to give you an idea of how I do it.
// Code here generates the menu from database
// Code here genereates popup alert messages from other users
//permanent links to external style sheets go here.
//You can also select skins here.
<?PHP
echo $display_style_sheets;
echo "<title>".$display_page_title."</title>";
?>
<script type="text/javascript" src="JAVASCRIPT GOES HERE.js"></script>
</head>
<body <?PHP echo $display_onload_scripts;?> >
<div id="page_area" >
<div id="banner">
</div>
<?php
echo $display_above_menu;
if(!$hide_menu){echo $display_menu;} //Insert the menu variable here.
echo $display_below_menu;
?>
<div id="content_area">
<div id="inner_content">
<?PHP
if($display_number_of_columns==1)
{
echo "<div id='onecolumn'>".$display_one_column."</div>"; //I only use this one
}
if($display_number_of_columns==2)
{
echo "<div id='leftcolumn'>".$display_left_column."</div>"; //these are left for legacy support from before I got better at CSS.
echo "<div id='rightcolumn'>".$display_right_column."</div>";
}
echo "<div id='footer'>".$display_footer."</div>"; //just in case - I hardly use it.
echo $display_pop_box; //for user alert messages to other users
?>
</div>
</div>
</div>
<div id="logbox"> Automatic Logout statement</div> //this is called by JS to activate timeouts.
</body>
</html>
<?PHP
$mysqlidb->close();
?>
Sorry it's such a lot of code. The layout allows easy adaptation and makes it simple to find the offending variable if things are not going as expected. There are more elegant solutions but this works well for me and is very fast.
I have a Symfony 1.4 project. As you know the Template layout is defined independently, in the apps' templates' folder and then it is universally applied to all other templates. My layout is very simple, something like this:
<div id = "header">
</div>
<div id = "content">
<?php echo $sf_content ; ?>
</div>
<div id = "footer">
</div>
$sf_content, as most symfonians would know, essentially spits out the template for whatever web page is being viewed at the moment. If I needed some specific data for my header, such as logout, logo etc, I would simply include it within my header. THis works great because it is static in nature. The challenge I am facing is how I can include data that is dynamic in nature and specific to a page within the header tag because the UI demands that I include it there.
For instance, one of my webpages requires user specific data to be loaded in a dropdown/select menu. This is dynamic and could range from 0 to 100 and is specific to each user. To create this dropdown menu is not an issue, and I already have that part done. The challenge is, how do I load it in the header, given that my data becomes part of $sf_content and that is spit out in my content div.
Is there a way for me to move a specific part of my $sf_content into the header div ?
In your actions.php:
$this->getResponse()->setSlot('someData', 'and its value');
In layout.php:
<div id="header">
<?php echo get_slot('someData'); ?>
</div>
<div id="content">
<?php echo $sf_content ; ?>
</div>
<div id="footer">
</div>
Slots work for this. They can either be set in the action as in the first answer above or you can define them in the templates themselves. This is what I've done where I have dynamic data to define for the layout.
In your example:
<div id="header">
<?php include_slot('some slot name')?>
</div>
<div id="content">
<?php echo $sf_content() ?>
</div>
<div id="footer">
</div>
In the templates you would define the following:
<?php slot('some slot name')?>
//your code goes here
<?php end_slot() ?>
When the layout is then rendered Symfony will place the code between the slot() and end_slot() into the point at which you defined by using include_slot().
For ease I created a global partial that is included in all templates that defines the various common slots used through out the application. There is more info on slots and their usage here