Display all users/authors in wordpress template - php

I'm trying to display all my authors/users in a custom page template using advanced custom fields. I'm using the following code to display their profile photos that grab from an acf image field called author_header. I put the users in an unordered lists by the following.
<div class="author">
<ul>
<li>
<?php
$publisher_photo = get_the_author_meta('author_header');
$image_src = wp_get_attachment_image_src($publisher_photo);
echo '<img src="'. $image_src[0] .'" />';
?>
</li>
</ul>
</div>
The problem I'm facing is that all the users get my profile photo. I want to be able to just grab the ones that they uploaded to the author_header field.
I have also tried this revised code but the img src doesn't show up.
<?php
$field_name = "author_header";
$post_id = "user_{$user_id}";
$publisher_photo = get_field($field_name, $post_id);
$image_src = wp_get_attachment_image_src($publisher_photo);
echo '<img src="'. $image_src[0] .'" />';
?>
I do have all of their names correctly displaying in the unordered list by the following.
<h2 class="authorName">[ <?php echo $user->display_name; ?> ]</h2>

You should add the user ID in get_the_author_meta like this:
$user_id = $user->ID;
$publisher_photo = get_the_author_meta('author_header', $user_id);
Please make sure that you will add this code in the loop, so user_id will be different for different user every time.
Regards,
Stanimir

Related

How to enable images gallery in WordPress

I am trying to enable the function of images to show in a gallery in a post.
I have tried to just do a gallery the "normal" way in wordpress by uploading images, picking the ones I need and putting them into the post.
$post_id = 83;
$queried_post = get_post($post_id);
$title = $queried_post->post_title; ?>
<div id="gallery" class="section-top">
<h1 class="section-heading"> <?php echo $title; ?></h1>
<p class="center-find"><?php echo $queried_post->post_content;?></p>
</div>
I need to be able to show the gallery on the website. When I use the shortcode from the gallery of random pics I have checked off, I can see the images in the post, BUT when I enter my website on the front-page.php, all I get is the actually shortcode displayed and no images.
If I open the post as a "view post", the gallery is displayed, so I imagine that I am missing something in my code to get the images on the front page.
If I use the short code directly in front-page.php, I get the gallery as well, but then my users can't make the gallery like they want it to look like and would have to manually edit the template files themselves and they know nothing about coding.
You should apply a filter to the post content if you want it to pass the shortcode. You might also want to use get_the_title instead of the post object.
$post_id = 83;
$queried_post = get_post($post_id);
$content = apply_filters( 'the_content', $queried_post->post_content );
$title = get_the_title($post_id);
<div id="gallery" class="section-top">
<h1 class="section-heading"> <?php echo $title; ?></h1>
<p class="center-find"><?php echo $content; ?></p>
</div>

Advanced Custom Fields repeater image caption

I am trying to display an image caption for a wordpress Advanced Custom Fields (ACF) repeater field, and haven't had any luck with the follow three options:
<?php if($middle_image['image']): ?>
<?php $midimage = wp_get_attachment_image_src($middle_image['image']); ?>
<?php $caption = $midimage->post_excerpt; ?>
<?php $captiontwo = $middle_image['image']['caption'] ?>
<?php $captionthree = $middle_image['image']->post_excerpt; ?>
<?php $alt = get_post_meta($middle_image['image'], '_wp_attachment_image_alt', true); ?>
<?php $main_image = wp_get_attachment_image_src($middle_image['image'], 'two-column-cropped' ); ?>
<div class="two-column-cropped"><img src="<?php echo $main_image[0]; ?>" alt="<?php echo $alt ?>" />
<?php if($caption) { ?>
<div class="image_caption"><?php echo $caption; ?></div>
<?php } ?>
</div>
<?php endif; ?>
Any suggestions would be appreciated. Thanks.
wp_get_attachment_src() does not fetch any data about an image besides the URL, height and width. You might want wp_get_attachment_metadata() however I think you would be better off changing your ACF field to return an Image Object (actually an array) instead of the Image ID (as I assume you have it now).
ACF can return any of three things for an image field: The image src URL, the Attachment ID (which can be passed to functions such as wp_get_attachment_image_src()), or the attachment information as an array.
You can check that you are receiving the correct response from ACF by using var_dump($middle_image) or var_dump($midimage)
I assume that $middle_image is your repeater field.
As long as ACF is configured correctly to return the image object (instead of the image URL or ID), you can simply remove this line:
<?php $midimage = wp_get_attachment_image_src($middle_image['image']); ?>
and then access the image caption using $middle_image['image']['caption']

Display an image alt or title below the image and in h1 html tag

I've got an image carousel in a site. I want to display the image alt tag or title below the image when I do mover over. At the same time I want to display that same name in another h1 tag.
The code is in PHP and Magento implementation. I know it is a simple trick. But I tried all the codes using jQuery after, append and replacewith functions. These functions are working. But I couldn't display the alt or title name.
Php Code:
<ul id="mycarousel" class="jcarousel-skin-tango alt">
<?php
// products
if(!isset($CatID))
$CatID = 10; // Set to classic collection if empty;
$_category = Mage::getModel('catalog/category')->load($CatID);
$products = Mage::getModel('catalog/product')->getCollection()
->addAttributeToFilter('status', 1)//enabled
->addCategoryFilter($_category);
foreach($products as $index=>$prod):
$product = Mage::getModel('catalog/product')->load($prod->getId());
echo '<li style="border: none;">
<a class="thumbActImg1" href="'.$product->getProductUrl().'" data-rel="'.(string)Mage::helper('catalog/image')->init($product, 'small_image')->keepFrame(FALSE)->resize($_resize, $_resize).'" alt="'. $product->getName() .'">
<div class="thumbActImg2">
<img src="'.$product->getThumbnailUrl(80, 80).'" alt="'. $product->getName() .'" />
</div>
</a>
</li>';
endforeach;
?>
</ul>
jQuery code:
jQuery(this,'img.thumbActImg2').after('<div class="pname"><?php echo $product->getName()?></div>');
jQuery('#pro_name h1').replaceWith('<h1><?php echo $product->getName()?></h1>');
Right now, I used php echo in order to display name. But it displaying the current page product name instead of mover over image name.
Could anyone help me out please.
Hi,
the PHP-Code is evaluated once, when the site is generated. So the <h1><?php echo $product->getName()?></h1> is always the same text.
You have to rewrite/get the current information from the image, when it's cycled (if I understand you). So here is what may work for you:
//insert the code, where the carousel is triggered
//get the alt attribute from image and replace h1 content
jQuery('#pro_name h1').html(jQuery('img.thumbActImg2').attr('alt'));
I hope this is what you're looking for, the problem isn't descripted very briefly.
Greetings Mat

Display repeater field of ACF

i´m trying to display a repeater field made of images in my wordpress template but it just doesn´t work. I tried reading the doc of the plugin:
http://www.advancedcustomfields.com/add-ons/repeater-field/
But still can´t make it work.
Here it´s the markup:
<div id="slideshow">
<ul id="slides">
<li><img src="<?php the_repeater_field('home_slider'); ?>" alt="" /></li>
</ul>
</div>
The name of the repeater field is "home_slider" and the name of the field is "home_image". Please can someone help me out?
This is what displays after load the page:
<img src alt>
The repeater-field stores everything in a array, so you need to retreive it then loop it out, try this:
$slides = get_field('home_slider'); // Grabs the array
// Check if there is any data in the array before looping
if($slides) {
echo '<ul id="slideshow">';
foreach($slides as $s) {
echo '<li>';
echo '<img src="'.$s['home_image'].'" alt="" />';
echo '</li>';
}
echo '</ul>';
}
Now depending on what you set the image to return (image url, attachement ID or Image Object ) you will need to use different methods to get the path to the image.

Google+ Plus API Define a specific image variable

I am trying to integrate the Google+ API on my website so that when a user submits approval via Oauth their Google+ activity feed will be displayed.
I have all of it working pretty much and am working on defining the variables that it will display for their feed.
Currently, this is what I have that IS working:
$activityMarkup = '';
foreach($activities['items'] as $activity) {
$url = filter_var($activity['url'], FILTER_VALIDATE_URL);
$title = filter_var($activity['title'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_HIGH);
$content = filter_var($activity['object']['content'], FILTER_SANITIZE_STRING, FILTER_FLAG_STRIP_HIGH);
$published = $activity['published'];
$totalItems = $activity['object']['plusoners']['totalItems'];
$activityMarkup .= "<div class='activity'>
<a href='".$url."' target='_blank'>$title</a>
<div>$content</div>
<div><br/><span>Date Published: </span>$published</div>
<div><br/><span>Total Likes: </span>$totalItems</div>
</div><br/><br>";
What I am trying to get to work is adding in the image that is associated with the post, namely the thumbnail.
I have tried different variations based on using existing code that works, but I just can't figure it out.
According to the Google API, this is the information for that image:
object.attachments[].image object The preview image for photos or videos.
object.attachments[].image.url string URL of the link.
Here's a link to all of the activities available if the above information isn't enough:
https://developers.google.com/+/api/latest/activities#object.originalContent
If someone can help me figure out how to define the variable for the image, that'd be awesome.
I figured it out. If anyone needs it, here's the code.
$image='';
if(isset($activity['object']['attachments'])){
foreach($activity['object']['attachments'] as $att){
if(isset($att['image']['url'])) {
$src = $att['image']['url'];
To call it out:
<img src='$src'>
<?php
$image='';
if(isset($activity['object']['attachments']))
{
foreach($activity['object']['attachments'] as $att)
{
if(isset($att['image']['url']))
{
$src = $att['image']['url'] ;
}
}
}
?>
<img src='<?php echo $src ?>'>
Works a Treat - https://developers.google.com/+/api/latest/activities#object.originalContent
<?php foreach($activities['items'] as $activity): ?>
<div class="activity" >
<div class="title" ><a href="<?php echo($activity['object']['url']) ; ?>" ><?php echo($activity['object']['content']); ?></a></div>
<p>Published at <?php echo($activity['published']); ?></p>
<p>
<?php echo($activity['object']['replies']['totalItems']); ?> Replys .
<?php echo($activity['object']['plusoners']['totalItems']); ?> Plusoners .
<?php echo($activity['object']['resharers']['totalItems']); ?> Reshares
</p>
</div>
<?php endforeach ?>
Another Way to add to the Feed is with replies, plusoners and reshares

Categories