MarkupShortcodes

[Nico Knoll]

Hey ho,

I wrote a new module: ProcessShortcodes. It brings Wordpress like shortcodes to Processwire. A quick example:

<?php

$shortcode = $modules->get('MarkupShortcodes');

$shortcode->add('login', function($atts){
return '<form><h3>'.$atts['content'].'</h3><label>Enter password for "'.$atts['name'].'":</label> <input type="pass"></form>';
});

$content = 'Lorem ipsum dolor [login name="user"]Login[/login]';

echo $shortcode->render($content);

?>

You can:

add a shortcode:

$shortcode->add('login', function($atts){
return '<form><h3>'.$atts['content'].'</h3><label>Enter password for "'.$atts['name'].'":</label> <input type="pass"></form>';
});

remove a shortcode:

$shortcode->remove('login');

remove all shortcodes:

$shortcode->remove_all();

and use them:

$shortcode->render('Lorem [ipsum /] hello. [dolor name="nico" /]. Third possibility: [abc def="hij"]a text[/abc]. ');

As seen above there are three different possible syntaxes:

1.: [shortcode] or [shortcode /]

2.: [shortcode key="value" /] or [shortcode key="value"] or [shortcode key="value" second="bla" /]

3.: [shortcode]lorem ipsum[/shortcode] or [shortcode key="value"]lorem ipsum[/shortcode] or [shortcode key="value" second="bla"]lorem ipsum[/shortcode]

You can download it here: https://github.com/NicoKnoll/MarkupShortcodes

I will add it to the module section as soon as possible.

Edited September 26, 2012 by Nico

[ryan]

Very nice functionality here Nico!

This almost begs to be a Textformatter module… But probably makes more sense as a code tool like you have it, since the short codes have to be defined somewhere and are likely to be dynamic.

What it probably shouldn't be is a Process module, as it is now. Process modules are meant to be mini admin applications, whereas this is more of a markup tool. As a result, I might suggest naming it MarkupShortcodes, and defining it like this:

class MarkupShortcodes extends WireData implements Module {

 public static function getModuleInfo() {
   return array(
     'title' => 'Short Codes', 
     'version' => 101, 
     'summary' => 'Enables WordPress like shortcodes.',
     'autoload' => false,
     'singular' => true 
   ); 
 }

 public function init() {} // required by Module interface, but can be blank

 // ...
}

I'd also suggest updating your example to use "$modules->get('MarkupShortcodes');" rather than "new MarkupShortcodes();" because the MarkupShortcodes class won't be in scope and in a state where it can be instantiated unless retrieved from $modules.

Thanks for your good work in making this module.

[Nico Knoll]

Thank you, Ryan!

I changed this

[Nico Knoll]

Added it to the module-section: http://modules.processwire.com/modules/markup-shortcodes/

[Joss]

Hi Nico

I think your module might solve a problem I have - but I am not sure.

Would I be able to create a simple gallery (just a foreach loop round an image field) and then use your module so that the user can decide where in their text they want the gallery?

And what is the best way to do this?

Obviously, I know how to do the gallery bit, it was how I can create the shortcode.

All the best

Joss

[Nico Knoll]

Yes, that's what exactly what this module is for. I also made a contact form and a sitemap with it and stuff like this

Here's my sitemap  form example:

<?php

$shortcode->add('sitemap', function($atts){
	if($atts['page'] == '') {
		$atts['page'] = wire('pages')->get('/');
	} else {
		$atts['page'] = wire('pages')->get('name='.$atts['page']);
	}
	
	function sitemapListPage($page) {
	
		echo "<li><a rel='follow' href='{$page->url}'>{$page->title}</a> ";	
	
		if($page->numChildren) {
			echo "<ul>";
			foreach($page->children as $child) sitemapListPage($child); 
			echo "</ul>";
		}
	
		echo "</li>";
	}
	
	echo "<ul class='sitemap'>";
		sitemapListPage($atts['page']); 
	echo "</ul>";
});

?>

[Joss]

Ah, great!

I will now add it to my list of things in my new blog thingy I am doing!

You are dutifully forgiven.

[Joss]

Oh, sorry, stupid question:

Where do I actually put the markup? In the template file? (Or included file..)

[onjegolders]

Nico, this is a module I've been looking at for a while now, I'd love to be able to use WP-like shortcodes whereby a user could put in [gallery] or something, but like Joss, I'm a bit unsure about where to put the code and how the end user goes about adding one?

[diogo]

Must be on the template file because the echos are not inside a function 

edit: actually they are . But still it must be on the template file

[Joss]

Nothing like being certain about something .....

[Nico Knoll]

I use a file called shortcodes.inc and include it into head.inc. But you can put this code everywhere in your template. But before calling $shortcode->render() of course.

[Joss]

Okay, just to check (I am a beginner at this stuff)

I am trying to put together a shortcode that will render a little boring gallery - the shortcode allowing it to be placed anywhere in the main text.

1. Start by calling the module:

$shortcode = $modules->get('MarkupShortcodes');

2. Add a shortcode:

$shortcode->add('quickgallery', function($atts){

    $quickimages = $page->post_quick_gallery_image;
    echo "<div class='row-fluid'>";
    echo "<ul class='thumbnails'>";

    foreach ($quickimages as $quickimage) {
        echo "<li class='span3'>";
        echo "<a href='{$quickimage->url}' class='thumbnail fancybox'>";
        echo "<img src='{$quickimage->getThumb("quickthumbnail")->url}'>";
        echo "</a>";
        echo "</li>";
    }

    echo "</ul>";
    echo "</div>"

});

 

3. Render my short code - which is the point I am not sure about.

 

Also, can I create a whole list of shortcodes then render them all in one go, or do I have to treat each separately?

 

Oh, one other thing - is there anyway of limiting which field a short code can be used with?

 

 

Sorry for all the questions!
 

 

Joss

[Nico Knoll]

3. Render my short code - which is the point I am not sure about.

 

Also, can I create a whole list of shortcodes then render them all in one go, or do I have to treat each separately?

 

Oh, one other thing - is there anyway of limiting which field a short code can be used with?

 

 

Sorry for all the questions!

 

Joss

You have to define all of the shortcodes before you use $shortcode->render(). With $shortcode->render() you can choose the fields you want to be looked for shortcodes like:

echo $shortcode->render($page->body)

so $page->body would be rendered with shortcodes. You can do this as often as you want means for as many fields as you want.

And no there si no way to only allow special shortcodes for some fields...

[Joss]

Okay, I think I am getting there!
 

Thanks.

I might work with you on a little tutorial for this.

It is a really useful plugin that means better control of some items - but beginners like me might be a little bit out of their depth with it!

Thanks again

Joss

[onjegolders]

Okay, I think I am getting there!

Thanks.

I might work with you on a little tutorial for this.

It is a really useful plugin that means better control of some items - but beginners like me might be a little bit out of their depth with it!

Thanks again

Joss

That would be great Joss, I think your example of outputting a little gallery or something would be great.

[Joss]

Umm, except I am getting a bit stuck on it - I am definitely doing something wrong or leaving something out here....

[onjegolders]

Nico, could we have a small example but done from creating them in code to end user, using them in a textarea?

This looks great but I can't get my head around exactly how to implement them!

Thanks!

[Nico Knoll]

Okay, it's not that complicated:

---

Creating a shortcode in code

Like in my example above you could for example create a sitemap like this:

<?php

$shortcode->add('sitemap', function($atts){
	if($atts['page'] == '') {
		$atts['page'] = wire('pages')->get('/');
	} else {
		$atts['page'] = wire('pages')->get('name='.$atts['page']);
	}
	
	function sitemapListPage($page) {
	
		echo "<li><a rel='follow' href='{$page->url}'>{$page->title}</a> ";	
	
		if($page->numChildren) {
			echo "<ul>";
			foreach($page->children as $child) sitemapListPage($child); 
			echo "</ul>";
		}
	
		echo "</li>";
	}
	
	echo "<ul class='sitemap'>";
		sitemapListPage($atts['page']); 
	echo "</ul>";
});

?>

It's important to use wire('pages') instead of $pages inside the function. Same for wire('config'), wire('input'), ...

---

Use the shortcode

At first you have to add [sitemap] inside your textarea. You don't need to activate something spacial like TinyMCE or so for it. Just put [sitemap] or [whatever] (if you have something like "$shortcode->add('whatever', function($atts){ });") inside your textarea or textfield.

It won't work automatically. You have to use the function in your template field:

(if your fields name is "body")

$shortcode = $modules->get('MarkupShortcodes');

echo $shortcode->render($page->body);

Any questions left?

[onjegolders]

Thanks Nico

[Macrura]

Hey Nico - great and useful module!

It would be good to point out that this module requires PHP 5.3, else your whole site will WSOD.

-marc

[owzim]

Hi, great module.

Filed an issue on GitHub: https://github.com/NicoKnoll/MarkupShortcodes/issues/1

when there is content but no attributes $atts is empy.

[Nico Knoll]

Fixed it

[owzim]

Fixed it

Awesome! Works.

[Peter Falkenberg Brown]

Dear Nico,

Yes, a check for PHP 5.3 before loading the module would be helpful.

I'm running PHP 5.2.17, and copied the module files to my modules directory, and then when I clicked on check for new modules, I got a white screen, with this error:

Parse Error:     syntax error, unexpected T_FUNCTION (line 88 of
/home/.../public_html/site/modules/MarkupShortcodes/MarkupShortcodes.module)

I hit back, but got the same thing even when I just clicked on the Modules menu.
 

After I deleted the MarkupShortcodes directory, all was well.

So... it's choking and killing the admin/module page before it's even installed.

Perhaps if you add a check for the PHP version, and display a message, "Sorry, can't install... etc." that would be much better.

Also, a big note on the Module page would be helpful, to save time.

(Ryan, I wonder if code should be added to the Modules page that prevents this behavior. I would think that the check should also come from within PW, rather than relying on any particular module.)

Thanks,

Peter