How to loop through posts content and show only a specifc id or class

Question

I know that I can do this via CSS or javaScript but I wonder if Wordpress has a native way of doing this.

I have this code:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> 

                        <?php the_content(); ?>

But let's say, I just want to show a specific id or class contained in all those posts. Ex: #heading or .heading

How can I do that?

with ID you mean a specific field from the post object? btw.. the above code is not an html element (its a php code block) ;-) — funkysoul, Jan 14 '17 at 12:49
Sorry, it is is 'within' an html element:) Yes, I have posts that contain a specific html id. The big picture is: in one element of the page I want to show all the posts and content, while in another html element of the page I want to show only a particular html id included in all those posts.But for this last case I couldn't find any answer on google. Of course, I can use css display: none but all the content of the posts has to be loaded and I wonder if there is a better way. — viery365, Jan 14 '17 at 12:53
If I understood you correctly you want to show content(particular html id) from the posts in a different element. You still need to loop through every post. if the particular html id you looking for is inside the_content() there is as far as I know no way to get only that portion. if it's a custom field you still need to loop through the posts but instead of the_content() you just grab the appropriate field. — funkysoul, Jan 14 '17 at 13:01
Thank you very much! I needed to have a confirmation that is not possible without looping through all content or that wordpress doesn't have a way of exclude content while looping it. So, in this particular case I will use CSS and display none all the content apart from that html id. If you answer I will accept it. — viery365, Jan 14 '17 at 13:04
Is it what you need http://stackoverflow.com/questions/4594609/check-if-div-id-exists-php ? — mattkrupnik, Jan 14 '17 at 13:06
It is kind of and it helped it. Thank you:) Through the other comments I understood Wordpress has no way of excluding/selecting content whithin the posts while looping it. — viery365, Jan 14 '17 at 13:09

Lucas Bustamante · Accepted Answer · 2017-01-15T16:05:33.817

1

First, get only the post containing id="heading" with PHP:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> 

$post_content = get_the_content();
$find_this = 'id="heading"';
$find_this_single_quote = "id='heading'";

if (strpos($post_content, $find_this) !== false || strpos($post_content, $find_this_single_quote ) !== false) {
    the_content();
}

Then, filter the result with jQuery to get only the contents of #heading:

var content = $('#heading').html();

if (content != '') {
        $('#real-content').html(content);
}

Fiddle: https://jsfiddle.net/hyxhn7mg/1/

edited Jan 15 '17 at 16:05

answered Jan 14 '17 at 13:27

Lucas Bustamante

15,821
7
92
86

Thank you:) I am going to try it:) – viery365 Jan 14 '17 at 13:35
1

I don't think you'll get anything from this since it's searching through HTML and in HTML you won't find #heading, you will find id="heading" try changing the string for $find_this to 'id="heading"'; – Daniel Jan 14 '17 at 14:23
1

Umm, [strpos](http://php.net/manual/en/function.strpos.php) does not return `TRUE`. It returns an *integer*, or else `FALSE`. So, what you mean to write is `if ( $pos !== FALSE ) {`.... – random_user_name Jan 14 '17 at 14:28
@viery365 did it work? mind to upvote and accept answer? – Lucas Bustamante Jan 14 '17 at 19:35
@LucasB Sorry, yesterday I didn't have time afterwards, I am going to try this morning:) – viery365 Jan 15 '17 at 10:15
@LucasB So, I tested it out, and what this does (and I can call it a learning for me) is something like: show the content of a post if the post has "id="heading"" written on it. This is great, and can be useful for the future of my code. But what I really wanted seems kind of impossible in the server side with wordpress. It would be something like. If the post contains "id="heading"" show only the content inside of that id. so if that id contained `
Hello
` the result of the loop would only show `
Hello
`. But thank you very much for your time and consideration. – viery365 Jan 15 '17 at 12:11
1

@viery365 Perhaps you could print the content to a hidden div, then run a jQuery like this: https://jsfiddle.net/hyxhn7mg/1/ – Lucas Bustamante Jan 15 '17 at 14:16
@LucasB Thank you very much! I did something similar using only display: none, but your solution is even better because the loop only runs once and that was what I wanted. It was more of a performance wise question. If you answer with your last comment and add that via wordpress itself is not possible, I will accept it:) Thank you again – viery365 Jan 15 '17 at 16:02
@viery365 Updated the answer – Lucas Bustamante Jan 15 '17 at 16:06

How to loop through posts content and show only a specifc id or class

1 Answers1