Visual Theme Switcher Plugin

Author: Mark R. Evans mark@gllabs.org
Date: August 16, 2007

Overview

vTheme is a Visual theme switcher plugin for Geeklog. It allows you to visually browse and select from the available themes installed on a site.

To see vThemes in action visit gl Labs Test Site.

Geeklog vThemes Plugin Installation

The vThemes Plugin follows the standard Geeklog plugins procedure. Below we will document two methods to install the vThemes files, via FTP and via standard shell access to the server.

FTP Installation

If you do not have shell access to your server and can only use an FTP client to access your server, follow these instructions. If you have shell access to your server, you may want to jump down to the Shell Access Installation instructions below. To install vThemes, or any Geeklog plugin, you will need to un-archive the plugin on your local computer. The vThemes distribution will automatically create all the proper directories when it is un-archived. To un-archive a .gz file, you can use later copies of WinZIP or WinRAR.

  1. Create a temporary directory on your local hard drive to hold the vThemes files (let’s use C:\tmp for our example).
  2. Open the vthemes-1.0.0-1.4.1.tar.gz file with WinRAR.
  3. Select Extract All Files and point to the C:\tmp directory as the destination.

Now we should have a local copy of the vThemes Plugin in C:\tmp The directory should look like this:

+ tmp\
     + admin\
     + docs\
     + language\
     + public_html\
     + templates\
     + functions.inc

Now that you have a copy on your local hard drive, it is time to FTP up to your server. Start your FTP program, I recommend FileZilla if you do not have a program you use already. FileZilla is free and supports many different operating systems (Windows, Linux, etc.). Connect to your web server with your FTP program.

Our first FTP will be the entire vThemes distribution to your server. You will want to use the diagrams below to find the proper directory on your server and move the entire c:\tmp\vthemes\ directory to the path-to-geeklog/plugins/ directory.

To find the path-to-geeklog you can look in your Geeklog config.php file and see what directory is defined in the $_CONF['path'] line.

SPECIAL NOTE: For the initial FTP of the vThemes distribution, you will want to actually drag the vthemes folder from your local computer to the plugins directory on your server. The remaining FTP's below you will actually drag the files, not the parent directory.

 tmp/           path-to-geeklog/
    |                          |
    + vthemes/--+              + backups/
                |              + data/
                |              + include/
                |              + language/
                |              + logs/
                |              + pdfs/
                +------------->+ plugins/
                               + public_html/
                               + sql/
                               + system/
                               + config.php

Next, you will need to make a sub-directory under the public_html directory on your server called vthemes. For most FTP programs you can create directories by highlighting the parent directory, public_html in this case, then right click the mouse, select New Folder and name it vthemes. This procedure may be a little different depending on which FTP program you are using, check their documentation.

path-to-geeklog/
               |
               + backups/
               + data/
               + include/
               + language/
               + logs/
               + pdfs/
               + plugins/
               + public_html/
                            |
                            + vthemes <--- Make this subdirectory
               + sql/
               + system/
               + config.php

Next you will need to FTP all the files from the c:\tmp\vthemes\public_html\* directory to your server. Here you will want to select all the files and sub-directories in the public_html\ directory, not just the public_html\ folder. Follow the diagram below:

 tmp\            path-to-geeklog/
    |                           |
    + vthemes\                  + backups/
             |                  + data/
             + public_html/*-+  + include/
                             |  + language/
                             |  + logs/
                             |  + pdfs/
                             |  + plugins/
                             |  + public_html/
                             |               |
                             +-------------->+ vthemes/
                                + sql/
                                + system/
                                + config.php

Next, you will need to make a sub-directory under the admin/plugins/ directory on your server called vthemes.

 path-to-geeklog/
                |
                + backups/
                + data/
                + include/
                + language/
                + logs/
                + pdfs/
                + plugins/
                + public_html/
                |            |
                |            + admin\
                |                   |
                |                   + plugins\
                |                            + vthemes <--- Make this subdirectory
                + sql/
                + system/
                + config.php

Next you will need to FTP all the files from the c:\tmp\vthemes\admin\* directory to your server. Here you will want to select all the files and sub-directories in the admin\ directory, not just the public_html\ folder. Follow the map below:

 tmp\        path-to-geeklog/
    |                       |
    + vthemes               + backups/
             |              + data/
             + admin/---+   + include/
                        |   + language/
                        |   + logs/
                        |   + pdfs/
                        |   + plugins/
                        |   + public_html/
                        |                + admin/
                        |                       + plugins/
                        +----------------------->        + vthemes/
                           + sql/
                           + system/
                           + config.php

Congratulations! You should now have all the files uploaded to your server and you are ready to skin to the Online Installation step below.

Standard Shell Access Installation

  1. It is always a good ideas to perform a site backup. The vThemes plugin does not create any database tables, but you should always make a backup prior to installing a plugin.
  2. Uncompress the vThemes plugin archive while in the path-to-geeklog/plugins directory. The archive will create a directory called vthemes.
  3. In your public_html directory, create a directory called vthemes.
  4. Under public_html/admin/plugins/ directory, create a directory called vthemes.
  5. Change to your path-to-geeklog/plugins/vthemes directory.
  6. Copy the files in the admin directory to the admin/plugins/vthemes directory you created in step 4.
  7. Copy the files in the public_html directory to the public_html/vthemes directory you created in step 3.

Online Installation

Now that you have the files loaded on your server, it is time to actually perform the vThemes installation into Geeklog.

  1. Go to the plugin administration page. The vThemes plugin should show up with a link to install it. Click this link. The install page will tell you if it was successful or not. If not, examine the Geeklog error.log in path-to-geeklog/logs/ to see what the problem was. Fix the problem and re-install.
  2. Be sure and modify the vThemes config.php file to customize vThemes how you would like it.

Upgrade Process

Simply follow the installation process to copy the new files onto your server. Then enter the Geeklog Plugins manager, select vThemes and Upgrade.

Configuration

All of vThemes' options are controlled via its config.php file.

Option Description
max_width_preview Sets the maximum width of the thumbnail image
columns The number of columns to display
rows The number of rows to display per page
disable_menu Disable the 'vThemes' link as a menu item
disable_use_theme Disable the 'Use Theme' button
disable_download Disable the Download Theme link
drop_shadow Turns on the drop shadow effect on thumbnail view
reflection Turns on/off the reflection effect on thumbnail view

Advanced Options

vThemes can be much more than just a visual theme switcher, it can also showcase several themes with the ability to download directly from vThemes page.

vThemes will look for a theme.ini (this is the literal filename, do not substitute the theme name here) in each theme directory. The ini file should contain the following attributes:

  • name = ”theme name here
  • author = ”theme authors name here
  • url = ”URL to theme's support site
  • download = ”URL to download link
  • description = ”theme description goes here

Here is a sample ini file:

; Geeklog Theme Configuration File (comments start with ;)

[theme]
name = "gllabs"
author = "Mark R. Evans"
url = "http://www.gllabs.org"
download = "http://www.gllabs.org/filemgmt/index.php?id=138"
description = "gllabs is a clean theme with a fluid content area and fixed side navigation areas"

If the download attribute is in the ini file, then a download link will appear under the theme name in the vTheme display.

Usage

Usage is pretty straight forward. vThemes will place a link in the menu items, select it and you should see a list of all available themes. If your theme did not include screen shots, you will need to create them yourself if you want the preview feature.

If you click on one of the theme images, a larger image will open in a lightbox.

How to setup the screen shots

vTheme will look for 2 images in each theme directory:

  • tn_themename.png/jpg
  • themename.png/jpg

Replace themename with the actual name of the theme. It is my hope that theme authors will include these screen shots, and the theme.ini file mentioned above, in new theme distributions.

The recommended size of the tn_themename.png file is 300 pixels wide.

The recommended size of the themename.png file is 640 pixels wide.

Support

For any support issues, please use the support forums at:

gl Labs Support Site

ChangeLog

v1.0.0 - Initial Public Release

Connecté en tant que : Guest (Guest)
plugins/vtheme.txt · Dernière modification: 2008/09/08 11:10 par ::Ben
 

Download geeklog

Last version 1.8.1

Espace Membre





Devenir membre
Enregistrez-vous

Mot de passe oublié ?

Change language

Categories

  • Geeklog (38)
  • Plugins (53)
  • Thèmes (16)
  • My cart

    Votre panier (0 article)

    Votre panier est vide!

    0.00 EUR

    Visual Theme Switcher

    Test out available themes by selecting from one of the 6 available themes or give the Visual Switcher a try:

    Follow us on twitter

    En ligne

    Visiteurs: 8