Tutorial: Write your own tag

This tutorial describes how to write a Tag and make use of the JPlugger variables.

For writing your own Tag you need to have downloaded the JPlugger component and plugin before and have activated it. See Getting started with JPlugger for detailed information on this topic.

In this tutorial we want to write a little counter that displays the days left till a Birthday.

There are four different predefined variables $params, &$content, $jpfunc, &$vars. First we make use of $content.

1) $content or how the input / output works

Go to Components->JPlugger->Tag an create a new one.

Give it a name. This is the name with which you call it later in your page.

Let's call it BirthdayCounter.

In the code field we write:

Save the Tag. Don't use <?php at the beginning of the code. Make sure the status is published, the execution is set on text and you use the right opener / closer for the Tag on the article.

Now create a new article on your page and use your brand new Tag.

{BirthdayCounter}
The next birthday is coming.
{/BirthdayCounter}

Save the article and open it in your Browser. You should see something similiar to this:

The next birthday is coming.
218 days left

As you can see $content gives you the text between the opener and closer of the Tag and after the execution of the Tag $content gets rendered on your page.

You can write any HTML code in it simply as string.

2) $params or how to make your Tag flexible in usage

In this example we don't need input for $content as we just output the days left. Let's change our article a bit and make it more dynamic so we can specify a day and month for the birthday.

The next birthday is coming.
{BirthdayCounter month="4" day="21" /}

Go back to your Tag code. Now we can make use of the $params array. All parameters of a Tag, in this case month and day, are parsed into this array and are accessible by the parameter name.

The parameters id and jplgid are set from JPlugger so you can't define them yourself.

The output should be the same as before.

$params['month'] returns 4 and $params['day'] returns 21. Keep in mind that 4 and 21 are strings like all parameter values.

3) $jpfunc or how to use helper functions

$jpfunc gives you access to some often used helper functions like displaying messages or adding JavaScript / CSS to your page. For an overview of available functions look at the Reference for writing tags.

Now we can check if the given parameter values are invalid and output a message.

If you want to add a CSS or script file or a php lib you must place it in the approriate folder .../jplugger/id_of_your_tag i.e. with the media manager (Content->Media).

$path = $jpfunc->getURLPath($params['id']);

$jpfunc->addScript($path.'/yourFile.js');

4) $var or how to share data across Tags

In the array $vars you can store values across Tags during the rendering of the page.

All values in $vars can be accessed from any Tag on the page. So be careful and use unique parameter names i. e. with a prefix.

Advertising

© 2010 - 2017 FINWICK® UG

We have 35 guests and no members online