So, I have this special page template in WordPress. I want to use it to display a handful of posts by ID (which I will specify).
Something like
<?php displayPost(10); ?>
and it will have the posts thumbnail, title and some values from the post meta which I will use.
After searching and sweating for hours, this is what I have
<?php
class episodeDetails
{
public $id;
function episodeTitle(){
$title = get_the_title($this->id);
$mykey_values = get_post_custom_values( 'episode', $this->id);
foreach ( $mykey_values as $key => $value ) {
return $title." : ".value;
}
}
function episodeImage(){
return get_the_post_thumbnail_url($this->id);
}
function episodeLink(){
return get_the_permalink($this->id);
}
function episodeMp3(){
$mykey_values = get_post_custom_values( 'enclosure', $this->id);
foreach ( $mykey_values as $key => $value ) {
return strtok($value, "\n");
}
}
}
$episode = new episodeDetails;
$episode->id="480";
?>
<div class="list-videos">
<div class="list-videos-image">
<img width="404" height="404" src="<?php echo $episode->episodeImage(); ?>" class="attachment-portfolio-thumbnail wp-post-image" alt="<?php echo $episode->episodeTitle(); ?>">
</div>
<div class="list-videos-text">
<?php echo $episode->episodeTitle(); ?><br><a class="button" href="<?php echo $episode->episodeLink(); ?>" rel="bookmark"><i class="fas fa-play"></i> Play Now</a> <a class="button" href="<?php echo $episode->episodeMp3(); ?>" download=""><i class="fas fa-download"></i> Download MP3</a>
</div>
</div>
Now, it does display what I want but I feel that it can be done in a better and easier way. My way would require me to copy and paste the whole block of HTML again and again for every additional post. I want to simplify it and I am looking whether there is a concise way instead of my long and complicated HTML part which I feel is recursive.
Thank you
To strictly answer your question: just use a foreach loop.
// Your class declaration to be put here...
// Then declare your IDs
$episodeIds = array(480, 481, 482, ...);
// And finally loop over them
foreach($episodeIds as $id) {
$episode = new episodeDetails;
$episode->id=$id;
?><div class="list-videos">
<div class="list-videos-image">
<img width="404" height="404" src="<?php echo $episode->episodeImage(); ?>" class="attachment-portfolio-thumbnail wp-post-image" alt="<?php echo $episode->episodeTitle(); ?>">
</div>
<div class="list-videos-text">
<?php echo $episode->episodeTitle(); ?><br><a class="button" href="<?php echo $episode->episodeLink(); ?>" rel="bookmark"><i class="fas fa-play"></i> Play Now</a> <a class="button" href="<?php echo $episode->episodeMp3(); ?>" download=""><i class="fas fa-download"></i> Download MP3</a>
</div>
</div><?php
}
Or you can wrap the template part of the code in a function (like your example displayPost(...)) and then call that function within the loop.
// Your class declaration to be put here...
// The display method gets the $episode object as parameter
function displayPost($episode) {
?><div class="list-videos">
<div class="list-videos-image">
<img width="404" height="404" src="<?php echo $episode->episodeImage(); ?>" class="attachment-portfolio-thumbnail wp-post-image" alt="<?php echo $episode->episodeTitle(); ?>">
</div>
<div class="list-videos-text">
<?php echo $episode->episodeTitle(); ?><br><a class="button" href="<?php echo $episode->episodeLink(); ?>" rel="bookmark"><i class="fas fa-play"></i> Play Now</a> <a class="button" href="<?php echo $episode->episodeMp3(); ?>" download=""><i class="fas fa-download"></i> Download MP3</a>
</div>
</div><?php
}
// Then declare your IDs
$episodeIds = array(480, 481, 482, ...);
// And finally loop over them
foreach($episodeIds as $id) {
$episode = new episodeDetails;
$episode->id=$id;
displayPost($episode);
}
Related
I need to write filter data of my custom post type in custom function placed in functions.php:
The majority are corrected, but I cannot process these lines:
<div class="cpt-studies-block-image picture">
<?php $thumb_img=wp_get_attachment_image_src(get_field('image'),'custom-crop-studien'); ?>
<img class="img" src="<?php print($thumb_img[0]); ?>">
</div>
and:
<a href="<?php the_permalink()?>" class="cpt-studies-block-link link-read-more"> <?php
include get_stylesheet_directory() . '/img/svg/icon_arrow.svg';
?>
<?php if (get_field('button_text')):
the_field('button_text');
else : echo __('More', 'dw');?>
<?php endif;?>
</a>
Code in folder for writing Custom Post Type data:
if($query->have_posts()):
while($query->have_posts()) : $query->the_post();?>
<div class="col-md-6">
<div class="cpt-studies-block">
<div class="row">
<div class="col-md-6">
<a class="zoom-picture-hover" href="<?php the_permalink()?>">
<div class="cpt-studies-block-image picture">
<?php $thumb_img=wp_get_attachment_image_src(get_field('image'),'custom-crop-studien'); ?>
<img class="img" src="<?php print($thumb_img[0]); ?>">
</div>
</a>
</div>
<div class="col-md-6">
<span><?php the_field('date')?></span>
<h3>
<a href="<?php the_permalink()?>">
<?php the_title()?>
</a>
</h3>
<p class="cpt-studies-block-text"><?php the_field('text')?></p>
<a href="<?php the_permalink()?>" class="cpt-studies-block-link link-read-more"> <?php
include get_stylesheet_directory() . '/img/svg/icon_arrow.svg';
?>
<?php if (get_field('button_text')):
the_field('button_text');
else : echo __('More', 'dw');?>
<?php endif;?>
</a>
</div>
</div>
</div>
</div>
<?php endwhile;
endif;
?>
Code in Custom function in functions.php:
if(have_posts($wp_query))
{
while(have_posts($wp_query))
{
the_post();
echo '<div class="col-md-6">'
.'<div class="cpt-studies-block">'.
'<div class="row">'.
'<div class="col-md-6">'
.'<a class="zoom-picture-hover" href="'.get_permalink().'">'
.'<div class="cpt-studies-block-image picture">'
.$thumb_img=wp_get_attachment_image_src(get_field('image'),'custom-crop-studien').
'<img class="img" src=".print($thumb_img[0]).">'
.'</div>'
.'</a>'
.'</div>'
.'<div class="col-md-6">'
.'<span>'.get_field('date').'</span>'
.'<h3>'
.'<a href="'.get_permalink().'">'
.get_the_title().
'</a>'
.'</h3>'
.'<p class="cpt-studies-block-text">'.get_field('text').'</p>'.
'<a href="'.get_permalink().'" class="cpt-studies-block-link link-read-more">'
include get_stylesheet_directory() . '/img/svg/icon_arrow.svg';
'</a>'.
'</div>'.
'</div>'.
'</div>'.
'</div>';
}
}
Please can someone give me advice, or do I need to change method on writing these lines?
You got a syntax error:
.'<div class="cpt-studies-block-image picture">' // Add semicolon.
.$thumb_img = wp_get_attachment_image_src(
get_field('image'),'custom-crop-studien'). // Assignement can't be concatenated
// and missing parenthesis
'<img class="img" src=".print($thumb_img[0]).">' // Resume echo.
So:
// Ommited
.'<div class="cpt-studies-block-image picture">';
$thumb_img = wp_get_attachment_image_src(
get_field('image'), 'custom-crop-studien'));
echo '<img class="img" src=".print($thumb_img[0]).">'
Or better yet, use templates (as I explained in this other question of yours)
i am using a table on my website for products.
At the moment only the image is clickable but i want the whole line or at least all the information in the table to be linking to the productpage.
The image has this and works as a link to the productpage:
<td style="width: 15%;">
<div style="padding: 15px;">
<a href="<?php the_permalink() ?>" target="_blank" class="thumbnail alignleft"><img src="<?php
if (has_post_thumbnail($post->ID))
{
$img_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'single-post-thumbnail');
echo woof_aq_resize($img_src[0], get_tpl_option('tpl_3_img_width', $options), get_tpl_option('tpl_3_img_height', $options), true);
} else
{
echo WOOF_LINK . 'img/not-found.jpg';
}
?>" alt="<?php the_title() ?>" /></a>
</div>
<div style="clear: both;"></div>
</td>
Now i am trying to do the same thing for all the other info in the table wich have code like this:
<td style="width: auto;"><?php
$product = new WC_Product(get_the_ID());
echo $product->get_attribute('pa_voedings-spanning-dcac');
?>
</td>
Or even better make the whole line of the table a link. Thank you for your time,
Sjoerd
You can simply wrapp each cell content with a "a" balise like this:
<td style="width: auto;">
<?php $product = new WC_Product(get_the_ID()); ?>
<a href="<?php the_permalink() ?>" target="_blank">
<?php echo $product->get_attribute('pa_voedings-spanning-dcac'); ?>
</a>
</td>
I'm trying to figure out some php code.
I have a slider inside a fancybox popup.
What i need to do is then i click on image it gets me its alt text in "image-product-name" P class.
<div class="modal-body">
<button class="close">×</button>
<div class="UI-IMAGE image">
<img src="<?php echo Mage::helper('core/image')->init($_product, 'image', 'catalog/product')->resize(640, 400) ?>" width="640px" height="400px"
alt="<?php echo $this->htmlEscape($this->getImageLabel()) ?>"
title="<?php echo $this->htmlEscape($this->getImageLabel()) ?>">
</div>
<p class="image-product-name"><?php echo $_product->getName() ?></p>
<?php if (count($this->getGalleryImages()) > 0): ?>
<div class="previews UI-PREVIEWS">
<ul>
<?php foreach ($this->getGalleryImages() as $_image): ?>
<li>
<a href="#"
title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"
data-image="<?php echo $this->helper('core/image')->init($this->getProduct(), 'thumbnail', 'catalog/product', $_image->getFile())->resize(640, 400); ?>">
<img src="<?php echo $this->helper('core/image')->init($this->getProduct(), 'thumbnail', 'catalog/product', $_image->getFile())->resize(78, 78); ?>" width="78px" height="78px"
alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>"/>
</a>
</li>
<?php endforeach ?>
</ul>
</div>
<?php endif ?>
</div>
Right now its just echoes an image name.
What should i change in order to make it echo active image alt text?
You need javascript for this. In the next example I've used jQuery:
$('.imgClass').click(function(){ //When user click on your img
var altImg = $(this).attr('alt'); //Save the alt attribute into a variable
$('p.image-product-name').html(altImg); //Place the variable between the p tags;
});
without js just change the variable from:
<p class="image-product-name"><?php echo $_product->getName() ?></p>
to
<p class="image-product-name"><?php echo $this->htmlEscape($_image->getLabel()) ?></p>
pretty straighforward
//In PHP fetch content and truncate the string or variable, till 3rd breakline then display
//when i use this method the entire div deallocated and the its not displaying properly...hope the fetch content contain some image tags too // ...
<div class="mid-blks-cont">
<!-- Block1 -->
<div class="mid-block-1 boxgrid caption">
<?php
foreach ($querypost as $row) {
$content = $row->post_content;
$pcontent_overview = (strlen($content) > 300) ? substr($content,0,300).'... Read More' : $content;
if($img == "No Image Uploaded" ) {
?>
<img alt="" src="<?php echo base_url(); ?>assets/img/samples/sample1.jpg"style="width: 391px; height:231px"/>
<?php } else { ?>
<img alt="" src="<?php echo base_url(); ?>uploads/<?php echo $row->post_media ;?>" style="width: 391px; height:231px" />
<?php }?>
<h4 class="cat-label cat-label2"><?php echo $row->category;?></h4>
<div class="cover boxcaption">
<h3><?php echo $row->post_title;?><span class="topic-icn"><?php echo $row->comment_count;?></span></h3>
<p> <?php echo $pcontent_overview;?>....</p>
MORE <i class="fa fa-angle-double-right"></i>
</div>
<?php } ?>
</div>
</div>
so i guess this is pretty easy for most of you, but i can't figure this out.
im trying to make the links dynamic eg: href="linkname(#1 or #2 etc)"
any ideas?
<?php if ($top_fundraisers && is_array($top_fundraisers)): ?>
<?php foreach ($top_fundraisers as $index => $fundraiser): ?>
<a title="" class="fancybox" href="linkname(GENERATE CODE HERE)">
<div class="top-fundraiser">
<div id="newo<?php print htmlentities($index + 1); ?>" class="top-fundraiser-image">
<img src="<?php
if($fundraiser['member_pic_medium']) {
print htmlentities($fundraiser['member_pic_medium']);
} else {
print $template_dir . '/images/portrait_placeholder.png';
}
?>"/>
</div>
</div>
</a>
<?php endforeach;?>
<?php endif; ?>
Suppose below is what you need.
<?php if ($top_fundraisers && is_array($top_fundraisers)): ?>
<?php foreach ($top_fundraisers as $index => $fundraiser): ?>
<a title="" class="fancybox" href="linkname(#<?php echo $index + 1; ?>)">
<div class="top-fundraiser">
<div id="newo<?php print htmlentities($index + 1); ?>" class="top-fundraiser-image">
<img src="<?php
if($fundraiser['member_pic_medium']) {
print htmlentities($fundraiser['member_pic_medium']);
} else {
print $template_dir . '/images/portrait_placeholder.png';
}
?>"/>
</div>
</div>
</a>
<?php endforeach;?>
<?php endif; ?>