First off I have gone through this link http://codex.wordpress.org/Integrating_WordPress_with_Your_Website. I cannot use this.
I am trying to get the latest post from a WordPress installation on a remote server I own. They share the same database server so that is where I am taking the post now and then brining it back into my PHP app. This all works.
What doesn't work is the display. Before I was using nl2br to make new lines but this does not work right.
I have noticed that WordPress does some post-processing to add p tags to certain lines they consider should be paragraphs (not in uls or lis for example). They do this after grabbing the post from the DB (the p tags are not saved to DB).
I have tried to find out what post-processing they use in the source code but I have come up blank after finding the the_content function etc and where the $post var comes from but not finding the code I am looking for.
What post-processing function does WordPress use to add these paragraphs to make their posts look ok?
Edit
For regex or general PHP people here I am looking to change something like:
<em>awesome link</em>
<h3>Awesome Head</h3>
lalalaalal
<ul>
<li>Awesome li</li>
</ul>
Into something like:
<p>
<em>awesome link</em>
</p>
<h3>Awesome Head</h3>
<p>lalalaalal</p>
<ul>
<li>Awesome li</li>
</ul>
Missing out tags that obviously should not have p tags around them like h and ul and li tags.
The easiest, fastest way: parse the latest post from the RSS feed. You'll find all of the <p> tags automatically added for you.
The right thing to do would be as #BryanH said: use the RSS feed which already has the post pre-formatted for you.
However if you don't want to make an XML parser and deal with all the stuff that comes with it just to get a blog post then you can use something like:
$content = preg_split('/\\r?\\n/', str_replace(']]>', ']]>', $post->content));
foreach($content as $line){
if(strlen(trim($line)) > 0){
$line = trim($line);
if(!preg_match('/^(<|<\/)(ul|li|div|h[1-6])/', $line)){
echo '<p>'.$line.'</p>';
}else{
echo $line;
}
}
}
This is the code I personally used to solve this problem in the end.
There is probably a more robust and elegant way of doing this (quickly coded) however I tested this on a very complex blog post with images and lots of different tags and it seemed to work nicely without any errors.
I am still unsure what WP uses but this solves my problem in the end.
Related
I am new to Wordpress and am implementing a shortcode. My shortcode is super simple and the expected output is HTML5-compliant:
add_shortcode( 'my_code', function( $attributes ){
return '<div></div>';
});
When this gets emitted, I get the following HTML:
<a href="#">
<div></div>
<p></a>
As you can see, there appears to be auto formatting going on. I have followed the advice here, here, and have installed this plugin, all to no avail. I am looking for the magic secret that is making this formatting occur. Any assistance would be appreciated!
I cannot recreate the problem, after running the example i get the right output:
<div></div>
( the original HTML source, not the modified one that console shows, the HTML panel in console shows a live view on what the browser is showing )
The problem is when a shortcode output is wrapped inside paragraph, then the output is something like:
<p>Some text <div></div></p>
The blame for this broken HTML ( in HTML5 <div> inside <a> is permitted, but <div> inside <p> is not ) is on WordPress filter wpautop. That filter encloses text with <p> tag, replaces double line breaks with <p> tags, and single line breaks with <br /> tags. If the shortcode is right after the text its output will be part of the paragraph. To avoid that just put the new line between the text and the shortcode.
Some text
[my_code]
Some text
As I said I am a newb with Wordpress and I am learning the ropes here. It turns out the problem is due to a plugin. I deactivated all my plugins and the problem went away. So, lesson learned: if you have a really weird problem, disable plugins first to see if that is the source. Thanks to #Danijel for helping me out with this!
EDIT: FWIW, the plugin that causes this issue is this one (v1.0.18): https://wordpress.org/plugins/smpl-shortcodes/
I'm currently using a system for my portfolio where i add three images per project, which schould be inside an ul.
This works fine, but i need those img tags to be wrapped within li tags, and i have no clue how i should do this.
Take this:
<img src="img1.jpg"/>
<img src="img2.jpg"/>
<img src="img3.jpg"/>
Make this:
<li><img src="img1.jpg"/></li>
<li><img src="img2.jpg"/></li>
<li><img src="img3.jpg"/></li>
Thanks in advance!
Edit:
Sorry, here's more info for you guys:
I'm using Wordpress 3 as cms with custom post types.
The output is done via wp's "the_content()", where i put my images.
I know i could use wp's html editor to wrap li tags around manually,
the problem is that i wont be maintaining the site, so i want to make it easer for my coworkers.
This is why its outputting the img tags in a row, and i need to wrap those li tags around them.
I've read something about "preg_replace", but i cant seem to get it working.
EDIT:
I've found the solution, sometimes the easiest way is the best:
$thecontent = get_the_content();
$thecontent_format = '<li>'.str_replace(array("\r","\n\n","\n"),array('',"\n","</li>\n<li>"),trim($thecontent,"\n\r")).'</li>';
wraps every img element with a li, and then
echo $thecontent_format;
Anyways, thanks for you participation!
I don't want to sound stupid or anything but if your trying to do this with PHP I am assuming that PHP is also creating the img tags for display.... in that case all you have to do is:
echo "<li>";
image tag generating code goes here
and than close it off with:
echo "</li>";
do this for every image tag that being created...
Is that what you were asking?
I have an article formatted in HTML. It contains a whole lot of jargon words that perhaps some people wouldn't understand.
I also have a glossary of terms (MySQL Table) with definitions which would be helpful to there people.
I want to go through the HTML of my article and find instances of these glossary terms and replace them with some nice JavaScript which will show a 'tooltip' with a definition for the term.
I've done this nearly, but i'm still having some problems:
terms are being found within words (ie: APS is in Perhaps)
I have to make sure that it doesn't do this to alt, title, linked text, etc. So only text that doesn't have any formatting applied. BUT it needs to work in tables and paragraphs.
Here is the code I have:
$query_glossary = "SELECT word FROM glossary_terms WHERE status = 1 ORDER BY LENGTH(word) DESC";
$result_glossary = mysql_query_run($query_glossary);
//reset mysql via seek so we don't have to do the query again
mysql_data_seek($result_glossary,0);
while($glossary = mysql_fetch_array($result_glossary)) {
//once done we can replace the words with a nice tip
$glossary_word = $glossary['word'];
$glossary_word = preg_quote($glossary_word,'/');
$article['content'] = preg_replace_callback('/[\s]('.$glossary_word.')[\s](.*?>)/i','article_checkOpenTag',$article['content'],10);
}
And here is the PHP function:
function article_checkOpenTag($matches) {
if (strpos($matches[0], '<') === false) {
return $matches[0];
}
else {
$query_term = "SELECT word,glossary_term_id,info FROM glossary_terms WHERE word = '".escape($matches[1])."'";
$result_term = mysql_query_run($query_term);
$term = mysql_fetch_array($result_term);
# CREATING A RELEVENT LINK
$glossary_id = $term['glossary_term_id'];
$glossary_link = SITEURL.'/glossary/term/'.string_to_url($term['word']).'-'.$term['glossary_term_id'];
# SOME DESCRIPTION STUFF FOR THE TOOLTIP
if(strlen($term['info'])>400) {
$glossary_info = substr(strip_tags($term['info']),0,350).' ...<br /> Read More';
}
else {
$glossary_info = $term['info'];
}
return ' '.$term['word'].'',$glossary_info,400,1,0,1).'">'.$matches[1].'</a> '.$matches[2];
}
}
Move the load from server to client. Assuming that your "dictionary of slang" changes not frequently and that you want to "add nice tooltips" to words across a lot of articles, you can export it into a .js file and add a corresponding <script> entry into your pages - just a static file easily cacheable by a web-browser.
Then write a client-side js-script that will try to find a dom-node where "a content with slang" is put, then parse out the occurences of the words from your dictionary and wrap them with some html to show tooltips. Everything with js, everything client-side.
If the method is not suitable and you're going to do the job within your php backend, at least consider some caching of processed content.
I also see that you insert a description text for every "jargon word" found within content. What if a word is very frequent across an article? You get overhead. Make that descriptions separate, put them into JS as an object. The task is to find words which have a description and just mark them using some short tag, for instance <em>. Your js-script should find that em`s, pick a description from the object (associative array with descriptions for words) and construct a tooltip dynamically on "mouse over" event.
Interestingly enough, I was searching exactly NOT for a question like yours, but while reading I realized that your question is one that I had been through quite some time ago
It was basically a system to parse a dictionary and spits augmented HTML.
My suggestion would include instead:
Use database if you want, but a cached generated CSV file could be faster to use as dictionary
Use a hook in your rendering system to parse the actual content within this dictionary
caching of the page could be useful too
I elaborated a solution on my blog (in French, sorry for that). But it outlines basically something that you can actually use to do that.
I called it "ContentAbbrGenerator" as a MODx plugin. But the raw of the plugin can be applied outside of the established structure.
Anyway you can download the zip file and get the RegExes and find a way around it.
My objective
Use one file that is read to get the kind of html decoration.
Generate html from within author entered content that doesnt know about accessibility and tags (dfn and or abbr)
Make it re-usable.
Make it i18n-izable. That is, in french, we use the english definition but the adaptative technology reads the english word in french and sounds weird. So we had to use the lang="" attribute to make it clear.
What I did
Is basically that the text you give, gets more semantic.
Imagine the following dictionary:
en;abbr;HTML;Hyper Text Markup Language;es
en;abbr;abbr;Abbreviation
Then, the content entered by the CMS could spit a text like this:
<p>Have you ever wanted to do not hassle with HTML abbr tags but was too lazy to hand-code them all!? That is my solution :)</p>
That gets translated into:
<p>Have you ever wanted to do not hassle with <abbr title="Hyper Text Markup Language" lang="es">HTML</abbr> <abbr title="Abbreviation">abbr</abbr> tags but was too lazy to hand-code them all!? That is my solution :)</p>
All depends from one CSV file that you can generate from your database.
The conventions I used
The file /abbreviations.txt is publicly available on the server (that could be generated) is a dictionary, one definition per accronym
An implementation has only to read the file and apply it BEFORE sending it to the client
The tooltips
I strongly recommend you use the tooltip tool that even Twitter Bootstrap implements. It basically reads the title of any marked up tags you want.
Have a look there: Bootstrap from Twitter with Toolip helper.
PS: I'm very sold to the use of the patterns Twitter put forward with this Bootstrap project, it's worth a look!!
I am trying to write a blog system. The main page is consist of part of the content of blog entries.
The problem is how could I make sure the excerpt is truncated correctly, since the blog entries is stored in HTML code.
Thanks.
Your best bet would be to use strip_tags() to remove the HTML from it and show only the first 300 or so characters using substr. Otherwise you'd have to parse the HTML to break it at an appropriate place so as not to break the rest of your layout.
strip_tags() and wordwrap()
<?php
$blog_entry = '<div class="myclass"><p><h1>I am trying to write a blog system.</h1> The main page is consist of part of the content of blog entries.</p>
<p>The problem is how could I make sure the excerpt is truncated correctly, since the blog entries is stored in HTML code.</p>
<p>Thanks.</p></div>';
// Allow a couple of tags (<p>,<a>), or don't - wrap excerpts into your own CSS class in your UI
$thisExcerpt = wordwrap(strip_tags($blog_entry, '<p>,<a>'),50);
$thisExcerpt = explode("\n", $thisExcerpt);
$thisExcerpt = $thisExcerpt[0];
echo $thisExcerpt . '...';
?>
Outputs :
I am trying to write a blog system. The main...
I would like to integrate my tumblr feed in to my website. It seems that tumblr has an API for this, but I'm not quite sure how to use it. From what I understand, I request the page, and tumblr returns an xml file with the contents of my blog. But how do I then make this xml into meaningful html? Must I parse it with php, turning the relevant tags into headers and so on? I tell myself it cannot be that painful. Anyone have any insights?
There's a javascript include that does this now, available from Tumblr (you have to login to see it): http://www.tumblr.com/developers
It winds up being something like this:
<script type="text/javascript" src="http://{username}.tumblr.com/js"></script>
You can use PHPTumblr, an API wrapper written in PHP which makes retrieving posts a breeze.
If you go to http://yourblog.tumblr.com/api/read where "yourblog" should be replaced with the name of your blog (be careful, if you host your Tumblr blog on a custom domain, like I do, use that) you'll see the XML version of your blog. It comes up really messy for me on Firefox for some reason so I use Chrome, try a couple of different browser, it'll help to see the XML file well-formed, indented and such.
Once your looking at the XML version of your blog, notice that each post has a bunch of data in an attribute="value" orientation. Here's an example from my blog:
<post id="11576453174" url="http://wamoyo.com/post/11576453174" url-with-slug="http://wamoyo.com/post/11576453174/100-year-old-marathoner-finishes-race" type="link" date-gmt="2011-10-17 18:01:27 GMT" date="Mon, 17 Oct 2011 14:01:27" unix-timestamp="1318874487" format="html" reblog-key="E2Eype7F" slug="100-year-old-marathoner-finishes-race" bookmarklet="true">
So, there's lots of ways to do this, I'll show you the one I used, and drop my code on the bottom of this post so you can just tailor that to your needs. Notice the type="link" part? Or the id="11576453174" ? These are the values you're going to use to pull data into your PHP script.
Here's the example:
<!-- The Latest Text Post -->
<?php
echo "";
$request_url = "http://wamoyo.com/api/read?type=regular"; //get xml file
$xml = simplexml_load_file($request_url); //load it
$title = $xml->posts->post->{'regular-title'}; //load post title into $title
$post = $xml->posts->post->{'regular-body'}; //load post body into $post
$link = $xml->posts->post['url']; //load url of blog post into $link
$small_post = substr($post,0,350); //shorten post body to 350 characters
echo // spit that baby out with some stylish html
'<div class="panel" style="width:220px;margin:0 auto;text-align:left;">
<h1 class="med georgia bold italic black">'.$title.'</h1>'
. '<br />'
. '<span>'.$small_post.'</span>' . '...'
. '<br /></br><div style="text-align:right;"><a class="bold italic blu georgia" href="'.$link.'">Read More...</a></div>
</div>
<img style="position:relative;top:-6px;" src="pic/shadow.png" alt="" />
';
?>
So, this is actually fairly simple. The PHP script here places data (like the post title and post text) from the xml file into php variables, and then echos out those variable along with some html to create a div which features a snippet from a blog post. This one features the most recent text post. Feel free to use it, just go in and change that first url to your own blog. And then choose whatever values you want from your xml file.
For example let's say you want, not the most recent, but the second most recent "photo" post. You have to change the request_url to this:
$request_url = "http://wamoyo.com/api/read?type=photo&start=1"
Or let's say you want the most recent post with a specific tag
$request_url = "http://wamoyo.com/api/read?tagged=events";
Or let's say you want a specific post, just use the id
$request_url = "http://wamoyo.com/api/read?id=11576453174";
So all you have to do is tack on the ? with whatever parameter and use an & if you have multiple parameters.
If you want to do something fancier, you'll need the tumblr api docs here: http://www.tumblr.com/docs/en/api/v2
Hope this was helpful!
There are two main ways to do this. First, you can parse the xml, pulling out the content from the the tags you need (a few ways to do this depending on whether you use a SAX or DOM parser). This is the quick and dirty solution.
You can also use an XSLT transformation to convert the xml source directly to the html you want. This is more involved since you have to learn the syntax for xslt templates, which is a bit verbose.