PHP

SlideItMoo plugin for Wordpress implements the MooTools plugin having the same name into an easy to use plugin that allows you to set image galleries into your posts and pages with only a few clicks. The JavaScript source can be found here with various examples and implementation instructions.

If you know SlideItMoo, you know that it can be used in various ways ( as banner rotator, image slider, featured content presentation etc. ) but this Wordpress plugin only implements the image slider functionality for the horizontal slider. As for features, it allows displaying as many image sliders as needed into a post or page, each having its own properties and images. Also, you can call the plugin from your template files by passing it only 2 arrays, one containing the slider settings and one containing the images ids. Everything is kept as simple as possible to allow you to easily define sliders into your posts. (more…)

There are times when we need to display a bit too much content in a small space. One way to do it is by using tabs. Fancy tabs is a tabs navigation display that tries to cover most situations, from AJAX loaded tabs to auto navigation and multi purpose usage. To make things easier when designing the interface, all CSS is all external giving the possibility to change skins very easily without interacting with the JavaScript code.

Main features for this tab navigation system are:

- tabs can be rotated automatically but setting the number of milliseconds between them;
- ajax content in tabs;
- auto resizing according to tab content;
- tab highlight with smooth effect between classes in CSS;
- highly customizable from CSS;
- multiple entrance tab content effect ( fade, slide-fade ); (more…)

WP MyTube is the Wordpress plugin implementation for YouTube MooTools player embed with attached playlist. Simply put, this plugin will allow you to easily insert YouTube videos into your Wordpress blog posts based on username or video id only. The attached playlist will display the user videos giving you the possibility to add several videos and only one player in your blog posts. This is very useful, for example, if you are a publisher that wants to display his youtube videos into a blog post.

Videos are added to your posts when you either add them or on edit. No special other settings for it except the stylesheet if you want to change the looks. To add videos to you blog posts, when you add/edit a post you’ll notice a new “add media” icon in shape of a tv. Simply click it, fill in the necessary information and the plugin will add the custom code to your pages. Hit save and that’s it.

If you want to add more than one player into a single post, well, you can do that. The plugin allows any number of players to be displayed in a single post without problems.

Further more, you can style the player to have a default look and if you want a second player to have a different look, you can add custom CSS class to it by passing the class name when you insert a new player. (more…)

I have a MediaTemple dv 3.5 hosting account that I like a lot (MT support was great whenever I had an issue). Today I needed to install PEAR on one of my domains. To do that, I followed the tutorial from their KnowledgeBase ( please read it if you want to do the same thing; it’s available here ) and all went well for the domain I used ( I had to make a few tries to get it going – I’m a noob in this ).

My goal was to make this work on the main domain, although I needed this on a subdomain. Pear was installed successfully, but I needed Spreadsheets and OLE in order to make things work as planned. Unfortunately, they were not available.

To add them, I created in the httpdocs folder ( using a FTP client ) a folder called PEAR_modules and uploaded Spreadsheets and OLE source files. After that, I connected to my server ( SSH using putty ) and edited vhost.conf for that domain ( in the same way as the MediaTample tutorial explained ) by adding the include path to my PEAR_modules folder. (more…)

MooTooltips gives you the possibility to create bubble tooltips on HTML elements in an easy manner and with the possibility to set each tooltip’s behavior individually. It’s also possible to display as tooltip content the content of an HTML element from the page, some text you want to input or the result of AJAX calls.

Tooltips can be set directly on the rel parameter of any HTML element and simultaneously when you create a new class instance.

For example, if tooltips are set directly on the element (let’s say an anchor), the rel parameter will have a value like: <a … rel=”{content:’some_element_id’}” and that’s it. The tooltip displayed will have as content the ’some_element_id’ content. Or if you there’s only the need to display some text, it will look like this: <a … rel=”{text:’Some text I want to display in my tooltip’}”. AJAX calls are also simple. To display the tooltip with some remote AJAX retrieved content, simply use as rel the following: <a … rel=”{ajax:’some_page.html’}”.

To start the inline declared tooltips, a CSS selector is needed so basically all tooltips declared on page must have the same CSS class in order to get the script started. Optionally, there’s the possibility the pass a container for the tooltips; if none is provided, the script will scan the entire document. (more…)

SlideItMoo v1.1 comes with some new stuff implemented in it. Those of you familiar with version 1.0, skip to download read on. Updates have been made for more extensive usage of SlideItMoo. For the rest, some explaining. Also, the 1.0 version is available here and I’ll try to provide support for it if any needed.

SlideItMoo is a banner rotator, article spinner and image slider ( carousel ) developed with MooTools 1.2. Differences from the first version are the fact that the image slider now supports continuous sliding when navigating, offers the possibility to set how the slider will slide ( from left or from right ) when used with the auto slide feature on, offers the possibility to give it the item width ( width of the slider’s items ) and let it display the elements according to that width and the visible items parameter. (more…)

ChainedSelect is a MooTools 1.2 JavaScript plugin that enables the user to navigate through parent – children tree structure with indefinite number of nodes and make a selection when the desired option is encountered.

This approach offers a more powerful solution versus the classical drop down boxes chained together for a number of reasons: it takes significantly less space in the page; it can contain any number of nested levels, navigation would not be harmed; it can be styled according to the overall page design from CSS and most of all, it looks better.

The purpose of the plugin is to replace the classic chained dropdown lists that have 2 or more selects and get populated with options once you select an option from a previous one.

The whole idea behind this plugin evolves around the tree structure generated by a PHP file and sent to JavaScript as a JSON string. Giving the fact that the whole structure of the tree is loaded, the request to the PHP script is made only once and then the response is reused when navigating the nodes. Once a node is selected, the plugin allows the user to return on the path he used to get to the current node.

If an option is selected and the script that verifies the user’s entry returns an error (for example the e-mail address is invalid), the plugin offers the possibility to display the last selected option leaving it selected and accessible in POST / GET depending what method you used on the form. (more…)

I’ve been programming using PHP and MySQL for about 4 years by now. One thing that I’ve always hated was to write code. Don’t get me wrong, I love coding, what I hate is writing in 10 lines what I could do in 5. Besides the fact that is a terrible waste of time and effort, when I was put in the position of revising the code at a later time (to make changes or just for the sake of improving the code) I found myself in trouble trying to understand what the hell I was thinking back then. Another scenario is when someone else is taking what you started ( I know this because I had to take on someone else’s projects ).

Giving this, why not spend a little time thinking first and then start coding? Below are a few things I’ve found out with time. (more…)

Usually in a Flash gallery the images are shown using an XML file generated by the server (in our case using PHP). So, how do you create that XML file used to output the contents of your images folder?

Starting with PHP 5, we have some new tools added that ease out work. One in particular is of interest and that’s SimpleXML. In plain english, it offers the possibility to convert XML to an object and that may be used later in the code with simple array iterators. More than that, it can also output XML valid code to generate XML files.

For this example, besides SimpleXML, we’ll need one more thing: a way to read the folder containing the images. And for that we have readdir. So the process will go like this: first we need to read the entire directory with readdir() and after that we need to generate the XML output using SimpleXML. Remember, SimpleXML is available in PHP starting with version 5, so make sure you have it installed on your server.

To check your PHP server version, simply create a file called phpinfo.php and inside it put only this: <?php phpinfo(); ?> – after that, upload the file on your web hosting service. Open your favourite web browser and point it at this file ( www.mywebaddress.com/phpinfo.php ). The first this you’ll see will be the server version ( something like PHP Version 5.x.x ). Remember to delete the file after you’re done. (more…)

While performing a search, it’s ofter very useful to highlight in different colors, backgrounds or styles the search keywords in the results returned. This keeps focus on the keywords and helps scan the page faster to find the more relevant results.

But how exactly can that be done? As a basic idea, the following code ( a PHP class ) practically takes as parameters the text that needs to be highlighted and the particular keywords that need to stand out. Using a regular expression, every keyword in the text is replaced with a span HTML element having different styles applied according to the keyword it matches.

Please remember that the code below is just an example, it can be and should be extended; I’m only presenting it for demonstration and “how to” purposes. (more…)