Allow website users to set defined variable values

I previously used a Jukka Svhan tip to suggest a way to allow front-end articles sorting. Each of these tips used PHP code in a form which is not the best nor most friendly way to do so.

After the release of a first plugin dedicated to the Jukka’s feature ideas, I released oui_cookie as a more generic way to manage URL variables and cookies. Let me introduce it…

Requirements

  1. Textpattern 4.5+
  2. oui_cookie

Why?

It is sometimes useful to allow website users to set a defined variable as a kind of front-end preference to condition an output. It can be used to sort articles, to switch between different stylesheets, to output a disclaimer, etc.

How it is powered

The plugin mainly uses two Txp core functions, gps() and cs(); the first one let us know what is the value of a defined url variable, while the second reads the value of a cookie. With these tools and some other magic stuff, oui_cookie is able to check the url variable of your choice (you know, the thing at the end of http://my-website.com/?url_variable=value) then to compare its value with a list of accepted values, to return this value if valid, and to store it in a cookie for a pre-determined duration.

It is also able to delete the cookie set via the previously named url variable, by default, when its value is 0.

How it works

Ok, lets see the anatomy of the main plugin tag with all its attributes…

<txp:oui_cookie name="sort_by" values="custom_1, custom_2" default="custom_1" delete="custom_3" display="1" />@

This tag is looking for an url variable or a cookie named sort_by with a value like custom_1 or custom_2. If these conditions are true it displays the current value — and stores it from the url variable into a cookie if needed. If none of these values are read it returns custom_1 as a default value but it could also delete an existing cookie if the url is something like http://my-website.com/?sort_by=custom_3

In practice

The main tag used as a variable

As you probably guessed, the previous tag can now be used as the value of the sort attribute of <txp:article />. If the defined url variable and its values are called by the user via a select list for example, the article sorting will be altered.

Here is a basic list our basic list where each option is a sort order with an url variable as value…

<select onchange="window.location.href=this.value">
   <option value="" disabled selected>Sort by</option>
   <option value="?sort_by=custom_1">Size</option>
   <option value="?sort_by=custom_2">Weight</option>
   <option value="?sort_by=custom_3">Color</option>
</select>

…and here is our article tag:

<txp:article sort='<txp:oui_cookie name="sort_by" values="custom_1, custom_2" default="custom_1" delete="custom_3" display="1" />' />

All done; the plugin will generate the sorting value according to the user choice… but be careful, if Color is selected, what will happen? You should know…

The conditional tag is a <txp:if_variable> like tag

oui_cookie can also help by checking the status (set/not set) or the value of an url variable or a cookie defined with the main tag.

Here is a simple way to condition a title output from the previous code:

<txp:oui_if_cookie name="sort_by" value="custom_2">
   <h6>You're seeing products by weight</h6>
<txp:else />
   <h6>You're seeing products by size</h6>
</txp:oui_if_cookie>

No really new stuff here, but it will be useful.

This is the end, for now at least; homework time now!

You can comment on this tip at the forum thread for more information.

comments powered by Disqus