Ionic

(Difference between revisions)
Jump to: navigation, search
(Added "[Ionic] How to have navigation bar match the width of container")
 
(Added "Adding date below post titles on Posts page")
Line 1: Line 1:
=How to have navigation bar match the width of container=
+
==How to have navigation bar match the width of container==
  
 
Screenshots: [http://d.pr/FUT9 Before] | [http://d.pr/Ochy After]
 
Screenshots: [http://d.pr/FUT9 Before] | [http://d.pr/Ochy After]
Line 48: Line 48:
  
 
Thanks to [http://ithemes.com/forum/index.php?/topic/10133-change-navigation-size-for-iconic-child-theme/ Dana].
 
Thanks to [http://ithemes.com/forum/index.php?/topic/10133-change-navigation-size-for-iconic-child-theme/ Dana].
 +
 +
==Adding date below post titles on Posts page==
 +
 +
Edit index.php under wp-content/themes/BuilderChild-Ionic
 +
 +
Change
 +
 +
<pre class="brush:php;">
 +
<h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
 +
 +
<!--post text with the read more link -->
 +
</pre>
 +
 +
to
 +
 +
<pre class="brush:php;">
 +
<h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
 +
 +
<div class="date">
 +
<span class="weekday"><?php the_time( 'l' ); ?><span class="weekday-comma">,</span></span>
 +
<span class="month"><?php the_time( 'F' ); ?></span>
 +
<span class="day"><?php the_time( 'j' ); ?><span class="day-suffix"><?php the_time( 'S' ); ?></span><span class="day-comma">,</span></span>
 +
<span class="year"><?php the_time( 'Y' ); ?></span>
 +
</div>
 +
 +
<!--post text with the read more link -->
 +
</pre>
 +
 +
<gallery widths=200px caption="Before and After">
 +
File:adding-dates-to-ionic-before.png
 +
File:adding-dates-to-ionic-after.png
 +
</gallery>

Revision as of 01:10, January 24, 2011

How to have navigation bar match the width of container

Screenshots: Before | After

Edit the theme's style.css.

Change

.builder-module-navigation {
	font-size: 1em;
	background: transparent url('images/nav-bg.png') bottom;
	display: block;
	width: 99%;
	margin: 0em auto;
}

to

.builder-module-navigation {
	font-size: 1em;
	background: transparent url('images/nav-bg.png') bottom;
	display: block;
	width: 100%;
	margin: 0em auto;
}

and

.builder-module-navigation ul {
	float: left;
	display: block;
	background: url('images/nav-top-shadow.png') repeat-x;
	margin: 0;
	padding: 0;
	width: 99%;
}

to

.builder-module-navigation ul {
	float: left;
	display: block;
	background: url('images/nav-top-shadow.png') repeat-x;
	margin: 0;
	padding: 0;
	width: 100%;
}

Thanks to Dana.

Adding date below post titles on Posts page

Edit index.php under wp-content/themes/BuilderChild-Ionic

Change

<h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
			
			<!--post text with the read more link -->

to

<h3 id="post-<?php the_ID(); ?>"><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>
			
			<div class="date">
				<span class="weekday"><?php the_time( 'l' ); ?><span class="weekday-comma">,</span></span>
				<span class="month"><?php the_time( 'F' ); ?></span>
				<span class="day"><?php the_time( 'j' ); ?><span class="day-suffix"><?php the_time( 'S' ); ?></span><span class="day-comma">,</span></span>
				<span class="year"><?php the_time( 'Y' ); ?></span>
			</div>
			
			<!--post text with the read more link -->
Personal tools
Namespaces
Variants
Actions
iThemes Codex
Codex Navigation
Toolbox