• nymous

    (@nymous)


    I am creating themes for wordpress and I am using Pages (via wp_list_pages()) for the navigation. I know how to use css to make wp_list_pages inline and styled the way I want, BUT… what I am trying to do is insert text around the names of the pages.

    For example, if the page names are About, Contact, and Services… I want the output to look like {about} {contact} {services} or some such display.

    I am familiar with the :before and :after pseudo-elements, but they don’t do me much good since IE won’t display them. I know that I may have to create my own php script that pulls the information from the database and inserts text that way, but before I start that I want to make sure I’m not just ignorant and missing some easier way to do this.

    I’m creating a series of hyper-minimalist text-only theme designs and getting over this little hurdle will help, especially if I want to make them available to others.

    Any suggestions?

Viewing 1 replies (of 1 total)
  • Thread Starter nymous

    (@nymous)

    I couldn’t find any way to do what I wanted using wp_list_pages and I’m really opposed to changing wordpress core files (why would you when the system is so flexible). This is very specific to the layout I wanted, but if anybody else were looking for a similar output, I believe this would work. I’m not sure if you’d run into problems using this in your own theme, but you can try)…

    So, I created a function and included it in functions.php:

    <?php function nav() {
    				#this bit of code displays a text navigation menu of pages that are published with brackets around the text. Very Clean.
    				#I will be posting my completed theme "somewhere" soon. Hyper-minimalist, text-only. Clean.
    	$sql = "SELECT * FROM wp_posts WHERE post_type='page' && post_status='publish'";
    	$result = mysql_query($sql) or print('nope').mysql_error();
    			while ($row = mysql_fetch_array($result)) {
    				?>
    				<a href="<?php bloginfo('url');?>/?page_id=<?php echo $row['ID'];?>"><?php echo "{".$row['post_name']."} ";?></a>
    				<?php
    				}
    			}
    ?>

    I then put the following code in my header.php:

    <div id="nav">
    			<?php nav(); ?>
    			</div>

    Then finally, styled it in css with:

    #nav,#nav a:link, #nav a:visited {
    padding-bottom:10px;
    color:#000;
    text-align:center;
    }
    
    #nav a:hover {
    color:#666;
    }
Viewing 1 replies (of 1 total)
  • The topic ‘wp_list_pages inline with text surrounding’ is closed to new replies.