BuilderChild-Acute-Blue

(Difference between revisions)
Jump to: navigation, search
(Created page, added == How to show Previous and Next Post links in single posts ==)
 
Line 1: Line 1:
 
== How to show Previous and Next Post links in single posts ==
 
== How to show Previous and Next Post links in single posts ==
 +
 +
[[File:2013-02-20 10-39-13.png|800px|thumb|none]]
  
 
Edit child theme's <code>single.php</code>.
 
Edit child theme's <code>single.php</code>.
  
Change
+
'''1.''' Change [http://pastebin.com/vV7bGreC this] to [http://pastebin.com/nd6JNeEx this].
  
<pre class="brush: php; gutter: false;">
+
'''2.''' Add the following at the end of child theme's style.css (WP dashboard -> Appearance -> Editor):
<div class="alignleft"><?php previous_posts_link( __( '&laquo; Previous Page', 'it-l10n-BuilderChild-Acute-Blue' ) ); ?></div>
+
<div class="alignright"><?php next_posts_link( __( 'Next Page &raquo;', 'it-l10n-BuilderChild-Acute-Blue' ) ); ?></div>
+
</pre>
+
  
to
+
<pre class="brush:css; gutter: false;">
 +
.single-post .loop-footer .alignleft a,
 +
.single-post .loop-footer .alignright a {
 +
    background: none;
 +
    border: none;
 +
    text-shadow: none;
 +
    padding: 0;
 +
    display: inline;
 +
}
  
[http://pastebin.com/nd6JNeEx this].
+
.single-post .loop-footer .alignleft,
 +
.single-post .loop-footer .alignright {
 +
    padding: 4px 10px;
 +
    background: #0081C6 url('images/lines.png');
 +
    border: 1px solid #006194;
 +
    text-shadow: #00A1F7 1px 1px;
 +
}
 +
 
 +
.single-post .loop-footer .alignleft a:hover,
 +
.single-post .loop-footer .alignright a:hover {
 +
    background: none;
 +
}
 +
 
 +
.single-post .loop-footer {
 +
margin-top: 2em;
 +
}
 +
</pre>

Revision as of 23:10, February 19, 2013

How to show Previous and Next Post links in single posts

2013-02-20 10-39-13.png

Edit child theme's single.php.

1. Change this to this.

2. Add the following at the end of child theme's style.css (WP dashboard -> Appearance -> Editor):

.single-post .loop-footer .alignleft a,
.single-post .loop-footer .alignright a {
    background: none;
    border: none;
    text-shadow: none;
    padding: 0;
    display: inline;
}

.single-post .loop-footer .alignleft,
.single-post .loop-footer .alignright {
    padding: 4px 10px;
    background: #0081C6 url('images/lines.png');
    border: 1px solid #006194;
    text-shadow: #00A1F7 1px 1px;
}

.single-post .loop-footer .alignleft a:hover,
.single-post .loop-footer .alignright a:hover {
    background: none;
}

.single-post .loop-footer {
	margin-top: 2em;
}
Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox