The jQuery UI sortable widget offers a great interface for listing and moving element around.

I have been working on a small project of mine and figured that the sortable widget could be a great feature. I then started to output the list and the element that should be draggable like this:

My HTML list

<ul id="sort1">
  <li>
    <div>box no 1</div>
  </li>
  <li>
    <div>box no 2</div>
  </li>
  <li>
    <div>box no 3</div>
  </li>
</ul>

My jQuery code to enable the sortable widget and for getting a serialized result when an element has been dragged around:

$(document).ready(function() {
    $("#sort1").sortable({
        opacity: 0.6,
        update: function(event, ui) {…

With jQuery it is quick and easy to access and modify elements in a select dropdown box. There are of course several ways of doing thing and I will try to cover most of them here.

Quicklinks:
The test setup
Get the selected value from the select / dropdown box
Set the selected value
Insert new options and values in the dropdown box
Removing an entry from the select box
Disable and enable options
The code

The test setup.

For the following examples I will use a dropdown / select box like this:

10 Apples
5 Oranges
12 Bananes

The HTML-code for the dropdown is where basic:

<select id="dropdown">
<option value="apples">10 Apples</option>
<option value="oranges">5 Oranges</option>…

With this guide I will try to go through the very basic techniques of making a simple php script that can handle login authorization of website users.

The guide will be based on common Linux installations of both MySQL and PHP.

Step 1 – the database

Create a table in your MySQL database with 2 fields, username and password. This could be done by running the following code in your MySQL shell or from phpMyAdmin or another interface:

CREATE TABLE `login` (
`username` TEXT NOT NULL ,
`password` TEXT NOT NULL
)

The database table called login is now created with 2 field named username and password.

Step…

I was doing some benchmarking and performance analyzing on servers running Wordpress and TYPO3 websites and the result was not than good actually. My setup could use quite a bit of website optimization to get the pages loaded faster.

So. How do one find extra performance, without buying new expensive hardware. One way could to experiment with caching options. The eAccelerator software is highly recommend for TYPO3 setup, so I did some testing with this and there was quite a bit of performance hidden here.

The installation was quite simple on my setup. I followed the installlation guide which was more or less a…

Have you ever had the need for inserting extra stylesheet or javascript files in your TYPO3 template? I am used to having a TemplaVoila setup, which has the nice feature of mapping part of the header as part of the template, but this is not really that flexible when using extension template and etc.

An easy way of controlling this, is to setup the javascript and css files from the template configuration. There are some different ways of doing this and I will demonstrate two of them here.

The template configuration examples should be self-explainable, so I will not comment them futher:

Javascript…

If you are building a site, which should support more than one language, there are two ways of doing this. Okay, perhaps there are more than two, but I will only give two examples.

The two I will cover is:
1. Manually adding language page
2. Integrated TYPO3 language support

1. Manually adding language page

This I will only touch briefly, as the solution should be obvious when the layout is presented. It should be very easy. Just create a tree like this and manually do the linking:

That’s it.

2. Integrated TYPO3 language support

This is quite different compared to the first setup. We will…

This post will be about how to setup a TYPO3 template, with the option to have a different image on top of each page.

I’m using TemplaVoila with a very simple setup. 3 fields – header image, menu and a content-element. The focus will be on the header image element, which in my case is mapped to a <div > and saved as the type “TypoScript Object Path” with an “Object Path” named “lib.headerimg“.

The next step is to setup the template to insert an image in the lib.headerimg. This is done by inserting to following into the Template Setup field:

lib.headerimg = IMAGE
lib.headerimg…