I am setting up this site at games.nyls.edu. If you see when you click on any of the links on the 2nd column it opens up the first link. heres the code:
<?php query_posts('category_name=computable-diagrams&showposts=10'); ?>
<?php echo '<a onclick="changeCssClass(\'widget-title3\')" id="imageDivLink" href="javascript:toggle3(\'wp-cpl-widget3\', \'imageDivLink\');"><h3 id="widget-title3" class="widget-title">Computable Diagrams</h3></a> <ul id="wp-cpl-widget3" class="wp-cpl-widget" style="display: none;">'; while (have_posts()) : the_post(); ?>
<li class="wp-cpl wp-cpl-even"><a href="javascript:toggle9('testcontent3', 'imageDivLink6');">
<?php the_title(); ?>
</a> </li><div id="testcontent3" style="display:none;"><?php the_content();?></div>
<?php endwhile; ?>
</ul>
I would appreciate any help
<div id="testcontent3" style="display:none;">
this is inside loop ... will produce duplicate ids on the page ...you need to have unique id's for divs
Related
I am using the ACF Repeater to create rows of images/content and to show/hide when clicked. Everything looks good on desktop screens, with a row of 3 images, when an image is clicked, the hidden div shows up below and the background color toggles on so you know which image's content you are looking at.
My problem, is I am trying to get the same functionality on mobile, but when an image is clicked, the content shows up under the 3rd div. I want to be below the image that was clicked. Since I am using the ACF repeater, my php script creates the parent div (3 across) first and then the hidden divs below.
I don't mind creating a separate html markup for mobile, I just can't figure out how to make it work with the ACF repeater.
<div class="staff">
<?php if (have_rows('staff_rows')):
while (have_rows('staff_rows')): the_row(); ?>
<div class="staff-wrap">
<div class="staff_images">
<?php if (have_rows('staff_images')):
while (have_rows('staff_images')): the_row(); ?>
<a href="#/" class="<?php the_sub_field('staff_class'); ?> show staff-box">
<img src="<?php the_sub_field('staff_image'); ?>"><div class="image-box"><h3>
<?php the_sub_field('staff_name'); ?></h3>
<h3><?php the_sub_field('staff_position'); ?></h3></div>
</a>
<?php endwhile;
endif; ?>
<?php if (have_rows('staff_bios')):
while (have_rows('staff_bios')): the_row(); ?>
<div class="bios">
<div class="wrap">
<div class="<?php the_sub_field('bio_class'); ?> row"><?php
the_sub_field('bio_text'); ?></div>
</div>
</div>
<?php endwhile;
endif; ?>
</div>
http://toolboxdevmachine.com/TechNiche/about-us
Thanks for your help
I'm guessing you've already figured this out by now, in 2019. It looks like you are missing a few closing <div> tags, as well as ending your while loop and the primary conditional. I broke out the code, indented it and wrote it with the correct closing tags:
<div class="staff">
<?php if (have_rows('staff_rows')):
while (have_rows('staff_rows')): the_row(); ?>
<div class="staff-wrap">
<div class="staff_images">
<?php if (have_rows('staff_images')):
while (have_rows('staff_images')): the_row(); ?>
<a href="#/" class="<?php the_sub_field('staff_class'); ?> show staff-box">
<img src="<?php the_sub_field('staff_image'); ?>">
<div class="image-box">
<h3><?php the_sub_field('staff_name'); ?></h3>
<h3><?php the_sub_field('staff_position'); ?></h3>
</div>
</a>
<?php endwhile;
endif; ?>
<?php if (have_rows('staff_bios')):
while (have_rows('staff_bios')): the_row(); ?>
<div class="bios">
<div class="wrap">
<div class="<?php the_sub_field('bio_class'); ?> row">
<?php the_sub_field('bio_text'); ?>
</div>
</div>
</div>
<?php endwhile;
endif; ?>
</div>
</div>
<?php endwhile; ?>
<?php endif; ?>
i tried this code in the read more button i want the link of page
<div class="blogleft">
<ul class="eachblog">
<?php while ( have_posts() ) : the_post(); ?>
<li>
<h1>
<?php the_title();?>
</h1>
<div class="perpostbg">
<?php $content = get_the_content(); echo substr($content,0,400); echo '...';?>
Read more
</div>
</li>
<?php endwhile;?>
</ul>
</div>
use permalink
Read more
OR
Read more
Just write
Read more
This code in your search loop
I have
<?php while ( have_posts() ) : the_post(); ?>
<div class="boxes-third boxes-first">
<div class="latestthree">
<div class="title">
<?php get_the_title($id); ?> // I am trying to get the post title here but doesn't work
<span class="titlearrow"></span>
</div>
<div class="latestthreeimage">
<a rel="prettyPhoto" title="<?php get_the_title($id); ?>"> /same here
<?php the_post_thumbnail(array(300,133)); ?>
</a></div>
<div class="text">
Here i would like to get the excerpt of the post that is no longer than 25 words
<span class="textarrow"></span>
</div>
</div>
</div>
<?php endwhile; ?>
I am trying to do the above mentioned, but did not worked and on the last one did not find related info. I am using wp 3.7.1. Please help me.
You have used get_the_title() which does not print. To print out the title, add an extra echo:
<?php echo get_the_title(); ?>
Or you can use the_title(), which also prints:
<?php the_title();?>
Try just using,
the_title();
Reference.
I'm using WordPress to generate a list of posts.
The outputted HTML looks something like this:
<ul>
<!-- HERE -->
<li id="post-258" class="grid_6 convenience-stores" data-id="post-258">
<h1>Local Store #2</h1>
</li>
<li id="post-109" class="grid_6 convenience-stores" data-id="post-109">
<h1>Local Store #1</h1>
</li>
<!-- HERE -->
<li id="post-107" class="grid_6 where-to-buy" data-id="post-107">
<h1>Supermarket #2</h1>
</li>
<li id="post-105" class="grid_6 where-to-buy" data-id="post-105">
<h1>Supermarket #1</h1>
</li>
</ul>
I use the following PHP code to generate this:
<?php
while (have_posts()) : the_post();
$category = get_the_category();
$class = $category[0]->slug;
?>
<li data-id="post-<?php the_ID(); ?>" class="grid_6 <?php echo $class; ?>" id="post-<?php the_ID(); ?>">
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php the_post_thumbnail('small');?>
<?php endif; ?>
</li>
<?php endwhile; ?>
You can see I have 2 different categories / HTML class names "where-to-buy" & "convenience-stores".
Now, what I would like to do is "break" the loop when the category changes.
So, at the point in the above HTML where I have marked <!-- HERE -->, I was hoping I could add an <h2> element to signify a heading for the next set of posts.
Is this possible?
And if so, how do I achieve this?
Many thanks for your help.
Keep track of the previous value of $class (eg. $prevClass) and check against this in your loop. Presumably the records are already in $class order?
<?php
$prevClass = null;
while (have_posts()):
the_post();
$category = get_the_category();
$class = $category[0]->slug;
if ($class != $prevClass) {
/* echo appropriate heading / li here */
/* It needs to be contained in an LI here in order to be valid HTML */
echo "<li><h2>$class</h2></li>"; // Change $class to appropriate heading
}
?>
<li data-id="post-<?php the_ID(); ?>" class="grid_6 <?php echo $class; ?>" id="post-<?php the_ID(); ?>">
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php the_post_thumbnail('small');?>
<?php endif; ?>
</li>
<?php
$prevClass = $class;
endwhile;
?>
Note, however, that with your current HTML markup it is not valid to simply output an H2 in the places you have marked - these will need to be inside an li. Or, close and open the ul.
Having multiple H1s is not necessarily a good idea either, although several wordpress themes do seem to follow this structure. If you are using HTML5 and article/section then this might be OK. H2s might be more appropriate here.
<?php query_posts($query_string . '&orderby=rand') ?>
Hey all,
I've tried to implement the above piece of code into my portfolio page template.php.
http://www.some-things.net/category/work/
It's causing the css to break every so often. Reload it until it breaks and you will see what I mean. It pushes 2 of the portfolioitem blocks to the right a touch and forces the third to drop a line?
<div style="clear:both"></div>
<div class="gallery">
<?php query_posts($query_string . '&orderby=rand') ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="portfolioItem">
<a href="<?php the_permalink() ?>" class="desctitle" title="<?php the_title();?>"><?php the_post_thumbnail(); ?>
<span class="desctitle"><?php the_title(); ?></a>
</span>
</div>
<?php endwhile; ?>
</div>
The error isn't in the random layout code. It's caused by an empty "tile" in your page. here's the source of the offending tile:
<div class="portfolioItem">
<span class="desctitle">Love Jungle</span>
</div>
Notice there's no image.