WordPress.org

Ready to get started?Download WordPress

Forums

CMS - adding sidebar content within post (4 posts)

  1. jmcn
    Member
    Posted 6 years ago #

    Hi, new to this forum but not to WordPress...

    I'm working on my first WordPress-as-CMS project here and have had success for the most part. I am hung up however on one aspect. I have one post that needs to be split into two divs.

    I have a category called Profiles that's like a bios section for the company staff. The posts in Profiles must be displayed with a little sidebar with bullet points. The user has a brief bio then to the right of that there's several bullet points titled "Relevant Experience".

    I'd like the HTML from the post to look like this (abbreviated):

    <div id="doublecol1">
      <h3>Person's Name Here</h3>
      <h4>Title Here</h4>
      <img src="imgs/profile010.jpg" alt="Name Here" class="profileimg" />
      <p>Profile text here of several paragraphs.</p>
    </div>
    
    <div id="doublecol2">
      <h4>Relevant Experience</h4>
      <ul>
    	  <li>Some text here</li>
    	  <li>some more text here</li>
    	  <li>final bullet text</li>
      </ul>
    
      <p class="download"><a href="#">Download Profile</a></p>
    
     </div>

    With this I can just make doublecol1 and doublecol2 show up as a two col layout with CSS.

    Now I could probably insert all of this into a post (assuming it wouldn't change all my divs into paragraphs). The problem then comes when the client wants to add or modify one of their profiles however.

    How can I make this sidebar without having to put my HTML into the post? I would LOVE to be able to have in the post some code like <sidebar><h4>Relevant Ex.....</sidebar>then use some PHP to find and replace that with my <div id="doublecol2"></div>. This way the client cannot mess anything up.

    Has anyone done something like this before? Any advice would be much appreciated.

  2. Thomaska
    Member
    Posted 6 years ago #

    Hi,

    You could use conditionnal sidebar

    http://www.webdesignerwall.com/tutorials/wordpress-theme-hacks/

    I use it for my website running under WP : AboveLuxe.fr.

    For every category, you have a different sidebar.

    Make a category by profil and include a sidebar regarding the category :

    <?php
      $post = $wp_query- >post;
    
      if ( in_category('1') ) {
      include(TEMPLATEPATH . '/single1.php');
    
      } elseif ( in_category('2') ) {
      include(TEMPLATEPATH . '/single2.php');
    
      } else {
      include(TEMPLATEPATH . '/single_other.php');
    
      }
    ? >
  3. jmcn
    Member
    Posted 6 years ago #

    Thanks for the suggestion...but I don't think that will work for me in this case. Maybe I shouldn't have used the word "sidebar" as I don't mean as in a WordPress sidebar, rather, I need content written in a blog post to display in two columns.

    How can I dynamically add a <div> </div> into an already posted blog post? Is there a way to search for a particular text string like <sidebar>...</sidebar> then remove that an d replace it with HTML?

  4. marr
    Member
    Posted 6 years ago #

    I think you could accomplish this with the addition of custom fields in your post.

    Create a category page template. If "Profiles" is category id 4, then the template file needs to be named category-4.php.

    Set up both 'doublecol' divs within the loop of the template. The first to pull the_content, your post information, and the second to pull in the_meta, or your extra stuff from the custom fields.

    Use CSS to style the column divs to appear side-by-side.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.