go41

Re: Make 2 Featured Sections Next To Each Other :: Reply by Joern

von Joern am 24. Apr. 2010 | Keine Kommentare

you have now a div id featured inside a div id featured, not following a first one.
The complete code for this div in original theme is

Code:

<div id="featured">

   <img src="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images/featured.png" width="72px" height="17px" alt="" />

   <?php query_posts("showposts=4&category_name=Featured"); $i = 1; ?>

         <?php while (have_posts()) : the_post(); ?>
   <div class="clearfloat">
   <?php $values = get_post_custom_values("Image");
   if (isset($values[0])) { ?>
      <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
   <img src="<?php echo bloginfo('template_url'); ?>/scripts/timthumb.php?src=/<?php
$values = get_post_custom_values("Image"); echo $values[0]; ?>&w=100&h=65&zc=1&q=100"
alt="<?php the_title(); ?>" class="left" width="100px" height="65px"  /></a>
      <?php } ?>
   <div class="info"><a href="<?php the_permalink() ?>" rel="bookmark" class="title"><?php the_title(); ?></a>
<div class="meta">[<?php the_time('j M Y') ?> | <?php comments_popup_link('No Comment', 'One Comment', '% Comments');?> | <?php if(function_exists('the_views')) { the_views(); } ?>]</div>   

</div>
       </div>

      <?php endwhile; ?>

   </div>
So duplicating this would look like this:
<div id="featured">

   <img src="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images
...
...
      <?php endwhile; ?>

   </div>
   <div id="featured">

   <img src="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images
...
...
      <?php endwhile; ?>

   </div>

Anyway, two div ids with the same name are not allowed in the standard, so rename the second one and style this second one in style.css to float right.
I show you below the code for two posts per query with an offset of two, means you should have minimum four posts in featured category to display something.
Code:

<div id="featured">

   <img src="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images/featured.png" width="72px" height="17px" alt="" />

   <?php query_posts("showposts=2&category_name=Featured"); $i = 1; ?>

         <?php while (have_posts()) : the_post(); ?>
   <div class="clearfloat">
   <?php $values = get_post_custom_values("Image");
   if (isset($values[0])) { ?>
      <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
   <img src="<?php echo bloginfo('template_url'); ?>/scripts/timthumb.php?src=/<?php
$values = get_post_custom_values("Image"); echo $values[0]; ?>&w=100&h=65&zc=1&q=100"
alt="<?php the_title(); ?>" class="left" width="100px" height="65px"  /></a>
      <?php } ?>
   <div class="info"><a href="<?php the_permalink() ?>" rel="bookmark" class="title"><?php the_title(); ?></a>
<div class="meta">[<?php the_time('j M Y') ?> | <?php comments_popup_link('No Comment', 'One Comment', '% Comments');?> | <?php if(function_exists('the_views')) { the_views(); } ?>]</div>   

</div>
       </div>

      <?php endwhile; ?>

   </div>
   <div id="featuredright">

   <img src="<?php echo get_option('home'); ?>/wp-content/themes/arthemia/images/featured.png" width="72px" height="17px" alt="" />

   <?php query_posts('showposts=2&category_name=Featured&offset=2'); $i = 1; ?>

         <?php while (have_posts()) : the_post(); ?>
   <div class="clearfloat">
   <?php $values = get_post_custom_values("Image");
   if (isset($values[0])) { ?>
      <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>">
   <img src="<?php echo bloginfo('template_url'); ?>/scripts/timthumb.php?src=/<?php
$values = get_post_custom_values("Image"); echo $values[0]; ?>&w=100&h=65&zc=1&q=100"
alt="<?php the_title(); ?>" class="left" width="100px" height="65px"  /></a>
      <?php } ?>
   <div class="info"><a href="<?php the_permalink() ?>" rel="bookmark" class="title"><?php the_title(); ?></a>
<div class="meta">[<?php the_time('j M Y') ?> | <?php comments_popup_link('No Comment', 'One Comment', '% Comments');?> | <?php if(function_exists('the_views')) { the_views(); } ?>]</div>   

</div>
       </div>

      <?php endwhile; ?>

   </div>

Code above shows latest two posts of featured in div id featured and two previous posts in div id featuredright.
Now having this in place it’s the styling to do. In style css find:

Code:

#featured {

   width:300px;

   background:#fff;

   float:right;

   padding:10px 10px 9px 10px;

   }

and reduce width to width:280px;

and add a new entry just below this for featured right to float right
old and new together should look like this in style.css:
Code:

#featured {
   width:280px;
   background:#fff;
   float:left;
   padding:10px 10px 9px 10px;
   }
#featuredright {
   width:280px;
   background:#fff;
   float:right;
   padding:10px 10px 9px 10px;
   }

Actually now the two queries should display side by side. You can adjust the number of posts to show and the offset in second part.
btw: your archive.php shows an error on line 36 and stops…
____________________
you find me on Google+, Twitter and Facebook

(von: Joern)

Hier noch 10 weitere Ergebnisse dieses Threads:

Make 2 Featured Sections Next To Each Other

24. Apr. 2010 (von: Hanscrafter)

(Copied the text from the Arthemia Free forum)I'm testing this theme for my job's website at www.godaisies.com/LISSo what I need help in doing is that I want the Featured section to be two columns wide instead of continuing down the…

Re: Make 2 Featured Sections Next To Each Other :: Reply by Hanscrafter

26. Apr. 2010 (von: Hanscrafter)

Thanks, Joern for the assistance. I appreciate it very much. So I followed your steps above with a little modification since the positioning of where I want the featured column to be is further down the page. However, when I…

Re: Make 2 Featured Sections Next To Each Other :: Reply by Hanscrafter

26. Apr. 2010 (von: Hanscrafter)

I forgot that I also duplicated #featured .info and #featured .clearfloat in an attempt to get the picture and info text working for the featuredright section. Weiterlesen →

Re: Make 2 Featured Sections Next To Each Other :: Reply by Joern

26. Apr. 2010 (von: Joern)

sorry, not much time by now, but looking at your style.css I see:<!-- My attempt at a 2nd featured column to the right -->THIS IS NOT WORKING IN STYLE.CSS!The browser stops reading this file on the first occurance of a…

Re: Make 2 Featured Sections Next To Each Other :: Reply by Hanscrafter

26. Apr. 2010 (von: Hanscrafter)

Duly noted and changed. Unfortunately, that doesn't seem to have made a difference in just making changes to the style.css. I appreciate your sharp eye. Weiterlesen →

Re: Make 2 Featured Sections Next To Each Other :: Reply by Joern

26. Apr. 2010 (von: Joern)

to get the image styled edit this in style.css:#headline a img, #featured22 a img {...to look like this:#headline a img, #featured22 a img, #featuredright a img {...the title beside the images is normally in#featured .info {float:right;margin-top:5px;p... Weiterlesen →

Re: Make 2 Featured Sections Next To Each Other :: Reply by Hanscrafter

30. Apr. 2010 (von: Hanscrafter)

I had to do a lot more workarounds to get the alignment correct. Thank you so much for your effort!I'm still working on the duplication issue and came across this post (http://www.wprecipes.com/how-to-use-two ... cate-posts) which might solve it once t...…

Re: Make 2 Featured Sections Next To Each Other :: Reply by master

1. Mai. 2010 (von: master)

you have four posts in this category, so having one loop displaying two posts:Code:<?php query_posts("showposts=2&category_name=Featured"); $i = 1; ?>and the next loop displaying also two posts with an offset=2 should work:Code:<?php query_posts('showposts=2&category_name=Featured&offset=2'); $i = 1; ?>This is the sample code…

Re: Make 2 Featured Sections Next To Each Other :: Reply by Hanscrafter

3. Mai. 2010 (von: Hanscrafter)

Thank you both so much for your help! I was finally able to correct this problem of duplication. In the future, I hope this thread will assist others. One of my Featured stories was breaking the design and I eventually…

Issue with text and button spacing. CSS issue maybe? Help!

9. Aug. 2013 (von: omerkhan01)

Hi there, My site is located hereAs you can see the "Just pay 360.00 now", is spaced quite a bit from the button below.It is using an H6 header tag. When I remove the h6 tag and place the text…

Autor:

Du findest mich auch auf Google+, Twitter und Facebook!

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.


weitere forum Beiträge: