How to add advance custom field just after the post - php

I am using Genesis framework and I want to add advance custom field just after the post, I did some code but the field is not coming just after the post.
Here is the code:
add_action('genesis_entry_content', 'add_content_after_content');
function add_content_after_content() {
echo '<div class="tips-text-image">';
echo '<img src="' . get_field('image') . '">';
echo the_field('text');
echo '</div>';
}

You can use this http://genesistutorials.com/visual-hook-guide/ or install this plugins on your site https://wordpress.org/plugins/genesis-visual-hook-guide/
You can add extra content after content on this hooks.
add_action('genesis_entry_footer', 'after_new_content');
add_action('genesis_after_entry', 'after_new_content');
add_action('genesis_after_endwhile', 'after_new_content');
add_action('genesis_after_loop', 'after_new_content');
add_action('genesis_after_content', 'after_new_content');
add_action('genesis_after_content_sidebar_wrap', 'after_new_content');
function after_new_content(){ echo 'new content'; }

Set your fields as variable first, then use the variables in the echo's. Many times when you directly grab the data it places it outside of the container, thus pushing it to the top. Try this:
add_action('genesis_entry_content', 'add_content_after_content');
function add_content_after_content() {
$image = get_field('image');
$theText = get_field('text');
echo '<div class="tips-text-image">';
echo '<img src="' . $image . '">';
echo $theText;
echo '</div>';
}

Related

Pulling post from one wordpress site to another with links to each posts

I was trying to pull posts from one of my wordpress site to another using the WP REST API, I have successfully done that and the posts are displaying pretty well on the other site, but the issue now is that I want each post to be clickable, such that it opens the full article (post) when its been clicked on....
$json = file_get_contents('http://mywebsite.com/blog/wp-json/posts?filter[posts_per_page]=4');
// Convert the JSON to an array of posts
$posts = json_decode($json);
foreach ($posts as $p){
echo '<div style="color: #fff; float: left;" class="col-md-3 col-sm-3 col-lg-3">';
// Output the featured image (if there is one)
echo $p->featured_image ? '<img src="' . $p->featured_image->guid . '">' : '';
echo '<h5>Title: ' . $p->title . '</h5>';
// echo '<p>Date: ' . date('F jS', strtotime($p->date)) . '</p>';
$summary = $p->excerpt;
$pos=strpos($summary, ' ', 100);
$summary = substr($summary, 0, 100);
echo '<p>';
echo $summary;
echo '</p>';
echo '</div>';
}
So, what i need right now is to pull the link to each posts alongside....
I am just thinking of something like this: echo '<p>Link: ' . $p->link. '</p>';
You should have $p->link or $p->guid available.
You should be able to do print_r($p); within foreach and see exactly what data you have- would be useful if you'd copy that response here as well as that might help.
Try this it will work for you :
<?php
$link = get_permalink($p->ID); // This will get the link of the post from post ID.
echo '<p>Link: ' . $link. '</p>';
?>

Need Proper Syntax for Condition (wrap Image with link only when there is one)

we had a developer code something for a Custom Post Type in WordPress that we need to tweak just a touch. They're not available right now, but I think it's a pretty simple PHP issue if knowing the proper syntax. Unfortunately, I'm not completely PHP fluent, so hoping to get some help.
We have a posts landing page where we are just displaying a post thumbnail if there is one, and a link to the full post page (single) ONLY if an email address has been entered into the custom post type. If no email address was entered for the post, no link to the final post. Here's the main chunk of code that is currently working properly for this:
$team_query = new WP_Query($args);
while ($team_query->have_posts()) {
$team_query->the_post();
$member_email = get_post_meta(
get_the_ID(), '_base_team_email', true
);
$html .= '<div class="span-6 team-member">';
if (has_post_thumbnail()) {
$html .= '<div class="member-photo-wrap">'
. get_the_post_thumbnail(get_the_ID(), 'medium')
. '</div>';
}
if (!empty($member_email)) {
$html .= '<p class="member-email">'
. '<a class="linkIcon" href="' . get_permalink() . '#member-top">'
. 'Email & Bio »'
. '</a></p>';
}
$html .= '</div>';
}
All we need to do is tweak so that IF an email address has been entered, the same hyperlink is added around the thumbnail image so it can link to the final post along with the 'Email & Bio' text link. But if NO email address is found, the thumbnail image displays as-is (e.g, no link added).
THANKS!
This would add a link to the thumbnail as well, if the $member_email is not empty.
$team_query = new WP_Query($args);
while ($team_query->have_posts()) {
$team_query->the_post();
$member_email = get_post_meta(
get_the_ID(), '_base_team_email', true
);
// Create anchor tag to use when member email is not empty
$memberEmailAnchorStart = '';
$memberEmailAnchorEnd = '';
if (!empty($member_email)) {
$memberEmailAnchorStart =
'<a class="linkIcon" href="' . get_permalink() . '#member-top">';
$memberEmailAnchorEnd = '</a>';
}
$html .= '<div class="span-6 team-member">';
if (has_post_thumbnail()) {
$html .= '<div class="member-photo-wrap">'
. $memberEmailAnchorStart
. get_the_post_thumbnail(get_the_ID(), 'medium')
. $memberEmailAnchorEnd
. '</div>';
}
if (!empty($member_email)) {
$html .= '<p class="member-email">'
. $memberEmailAnchorStart
. 'Email & Bio »'
. $memberEmailAnchorEnd
. '</p>';
}
$html .= '</div>';
}
Depending on what the linkIcon class does, you might want to remove it from the thumbnail anchor tag.

If custom field has value, show in slidehow. Else hide

I'm using Wordpress and the PODS plugin and created the pod project. In project i've created a set of fields. One of those is project_slide. If this field has a value, I want to show this in a RoyalSlider on my frontpage.
I've started with this piece of code (= one slide).
<?php
$project = pods('project', array('limit' => -1));
while ($project->fetch()) {
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $project->display('project_slide') . '" alt="' . $project->display('project_title') . '">';
echo '</div>';
}
?>
The problem is: each project I add, displays in the slider. Even if project_slide has no value. Any idea how to resolve this?
Just add an if-statement to the loop.
Hide Image example
In my example, I only add the slide when the value isn't [empty string]
while ($project->fetch()) {
if( $project->display('project_slide') !== ""){
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $project->display('project_slide') . '" alt="' .$project->display('project_title') . '">';
echo '</div>';
}
}
Expand with a detection if the image actually exists
You could expand it with a file_exists to also check if it exists (for the items with value, but the image itself doesnt exists). Just make sure the file_exists is 2nd, that way it only checks if the file is present if the string is not empty (if-statements go from left to right)
$project->display('project_slide') !== "" && file_exists($_SERVER['DOCUMENT_ROOT'].$project->display('project_slide')`
Default image method:
Instead of showing it only when there is an image, you could always show it, but build a default-image logic:
$defaultImage = '/some/image.jpg'; // set a default image outside of the loop
while ($project->fetch()) {
$src= $project->display('project_slide') !== "" ? $project->display('project_slide') : $defaultImage; // set a default umage
echo '<div class="rsContent">';
echo '<img class="rsImg" src="' . $src . '" alt="' .$project->display('project_title') . '">';
echo '</div>';
}

outputting a featured image rather than a link to a featured image

In the past, I used this custom function to create an image carousel on my WordPress blog with Thesis theme
function top_carousel() {
echo '<div id="topcarousel">';
$the_query = new WP_Query(array(
'category_name'=>'featured',
'orderby'=>'date',
'order'=>'DESC',
'showposts'=>'4'
));
while ($the_query->have_posts()) : $the_query->the_post();
$do_not_duplicate = $post->ID;
$post_image = thesis_post_image_info('thumb');
echo '<div class="carouselu">';
echo '' . $post_image['output'] . '<br />' . get_the_title() . '';
echo '</div>';
echo '<div style="clear:both"></div>';
echo '</div>';
}
add_action('thesis_hook_before_content_box', 'top_carousel');
It has been a while since I used the code, and, having recently setup a new WordPress blog, I discovered it doesn't work anymore, in that the image isn't getting displayed with the link to the post.
Someone suggested to me that this might be because I'm using featured images in my new WordPress blog. Following that tip and looking at the code on the WordPress code, I changed part of the custom function above to look like this
$post_image = wp_get_attachment_image_src( get_post_thumbnail_id(), 'small');
echo '<div class="carouselu">';
echo '' . $post_image[0] . '<br />' . get_the_title() . '';
echo '</div>';
This results in a little progress. Now a link to the image appears above the headline, rather than the actual image. For example,
http://localhost:8888/wp-content/uploads/2013/12/Screen-Shot-2013-12-27-at-9.37.49-AM.png
How do I get the image to show, rather than just a link to where the image is uploaded?
Update
Using the first answer to this post, I tried this code unsuccessfully
$post_image = get_the_post_thumbnail($post_id, 'small');
echo '<div class="carouselu">';
echo '' . $post_image['output'] . '<br />' . get_the_title() . '';
echo '</div>';
I also tried this unsuccessfully
$post_image = wp_get_attachment_image_src( get_the_post_thumbnail($post_id, 'small'));
echo '<div class="carouselu">';
echo '' . $post_image['output'] . '<br />' . get_the_title() . '';
echo '</div>';
Neither of those solutions output anything, whereas my attempt at least output a link to the uploaded image. Am I using the function incorrectly?
You should use the function get_the_post_thumbnail, refering to the doc : http://codex.wordpress.org/Function_Reference/get_the_post_thumbnail
Usage:
<?php echo get_the_post_thumbnail( $post_id, $size, $attr ); ?>
To enable Post Thumbnails, the current theme must include
add_theme_support( 'post-thumbnails' ); in its functions.php file

Hide Div if no image in the loop

Im looking to create a condition in wordpress loop. if no image then image box (.thumbHome{display:none})
this is in my function.php
function getThumbImages($postId) {
$iPostID = get_the_ID();
$arrImages =& get_children('post_type=attachment&post_mime_type=image&post_parent=' . $iPostID );
if($arrImages) {
$arrKeys = array_keys($arrImages);
$iNum = $arrKeys[0];
$sThumbUrl = wp_get_attachment_thumb_url($iNum, $something);
$sImgString = '<img src="' . $sThumbUrl . '" alt="thumb Image" title="thumb Image" />';
echo $sImgString;}
else {
echo '<script language="javascript">noImage()</script>';
}
}
And my javascript:
window.onload = noImage();
function noImage(){
document.getElementByClassName('.thumbHome').css.display = 'none';
}
I tried:
window.onload = noImage();
function noImage(){
$('.thumbHome').addClass('hide');
}
RESULT: class hide added to all loop
I cant figure it another way, since im still new in coding.
thx
Well first of all, you don't want to call these functions on window.onload. That's going to immediately set all class instances of .thumbHome to hidden without any conditions.
Here's a very easy way to fix this issue. There are probably more intricate ways, but this works well.
In your main loop, add an unique id to each .thumbHome div based on the image id. So like:
echo '<div class="thumbHome" id="thumb-' . $iNum . '"> ... </div>';
// or you could you use the post ID, doesn't matter, as long as you are consistent
Then your else conditional (for whether there's a thumbnail) could be changed to:
else {
echo '<script type="text/javascript">noImage("#thumb-' . $iNum . '")</script>';
}
and your js function could be:
function noImage(var){
$(var).hide();
}
This is not necessary the best way to do this, it's just the best way with the situtation you find yourself in now.

Categories