How to use JavaScript in Joomla 1.6 Custom HTML Module

Introduction

Recently I tried to use a custom HTML module in Joomla 1.6.
There are a few problems with using this to get pure HTML displayed as you have copied it from somewhere to display a widget or something.
Even more complicated is to get JavaScript to work in the module. By default the <script> tag gets stripped out.

Be able to use pure HTML

By default any user in your Joomla backend (administration area) use the TinyMCE. When you create the Custom HTML Module the text field on the bottom left will also use this Editor. The problem is that this is a WYSIWYG editor(What You See Is What You Get). That means you basically enter regular text like in Word and the editor will translate it into the according HTML code. If you paste HTML into the editor it will not interpret the code as HTML.

There are two options to bypass that problem.

1. Go into HTML mode

The TinyMCE editor has a button HTML that lets you edit HTML. If you use this option you can past pure HTML there. Be aware that when you hit "Update" the Editor window only shows the interpreted code. So you don't see all the HTML tags anymore.

2. Turn of the Editor

I personally prefer the second option. If you worked a bit with HTML it will make sense for you too. Editors like TinyMCE still produce kind of messy code and things not always look like I want them.

To turn of the editor for your user perform the following steps:

• 1. Go to Users > User Manager.
• 2. Click on your user's name
• 3. On the right select at Editor "Editor - None"
• 4. Save

Now when you open a Custom HTML Module you just have a plain text field.

Be able to use JavaScript

If you past HTML code in the plain text field of the Custom HTML Module it should work now without problems. When you paste JavaScript though, the <script> tags will get stripped, which will make your JavaScript appear as text on the frontend.

To change the filtering of JavaScript in your text you can turn of filtering for your admin user like this:

• 1. Go to Content > Article Manager
• 2. Click Options
• 3. In the Popup go to Text Fitlers
• 4. Depending on what kind of user you are (e.g. SuperUser) change Filter Type to No Filtering
• 5. Save & Close

Text or Textarea Attribute in Joomla 1.6 Module prevent filtering

Another related problem is that in modules you have sometimes attributes you can set. If it is a textarea you want to use HTML or JavaScript here as well, but it all gets filtered, even if you have the above settings applied.

A solution here is to modify the module xml file and add teh attribute filter="raw" to the field definition.

Now you should have no problem to paste JavaScript and save it in the Custom HTML Module.
Let me know if you have any problems.

Point Domain to Subfolder in Bluehost for a Joomla 1.6 Installation

Introduction

Bluehost points your primary domain always to the public_html folder.
If you want to install your CMS like Joomla or Wordpress in a subfolder, rather than have all the files in the root, there is no easy build in way at Bluehost.

After reading through the Internet a trying tons of suggestions I found the solution that works for me and a Joomla 1.6 installation. It is a combination of several snippets I found online.

The Solution

Find the .htaccess file in the root folder (public_html) of you Bluehost webspace.
Open the file and add following code. Make sure you read the comments and make the according adjustments.

# Activate the rewrite engine
RewriteEngine on

# Replace yourdomain.com with your domain name.
RewriteCond %{HTTP_HOST} ^(www.)?yourmaindomain.com$

# Replace 'subfolder' with your subfolder name.
RewriteCond %{REQUEST_URI} !^/subfolder/

# Don't touch this line.
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

# Replace 'subfolder' with your subfolder name.
RewriteRule ^(.*)$ /subfolder/$1

# Replace yourdomain.com with your domain name.
# Replace 'subfolder' with your subfolder name.
# set index.php to whatever necessary for your CMS, for Joomla you don't need to change it
RewriteCond %{HTTP_HOST} ^(www.)?yourmaindomain.com$
RewriteRule ^(/)?$ subfolder/index.php [L]

Permanent Redirect yourdomain.com to www.yourdomain.com

If you want additionally forward yourdomain.com to www.yourdomain.com add following code to the .htaccess right below "RewriteEngine On".

# use "www", replace yourdomain with your domain name
RewriteCond %{HTTP_HOST} !^www\.yourdomain\.com$
RewriteRule ^(.*)$ http://www.yourdomain.com/$1 [L,R=301]

Permanent Redirect www.yourdomain.com to yourdomain.com

If you instead want to do the redirect the other way around, add following code to the .htaccess right below "RewriteEngine On".

# use "www", replace yourdomain with your domain name
RewriteCond %{HTTP_HOST} ^www\.yourdomain\.com$
RewriteRule ^(.*)$ http://yourdomain.com/$1 [L,R=301]

Troubleshooting

Please test after every step if everything is working so that you know at which point the new settings broke everything.

It also helps to clear the cache on your browser to make sure the current rewrite rules are used.

If you still have problems with your Joomla, I read it helps to additionally set the live_site parameter in the configuration.php to yourdomain.com.

How to Verify a Joomla 1.6.x Website with Google Webmaster Tools, Bing Webmaster Tools, Yahoo Site Explorer and Alexa

Introduction

This article describes how to verify your website with Google Webmaster Tools, Bing Webmaster Tools, Yahoo Site Explorer and Alexa, while using the Meta Tags verification method.

Downloading the latest Version

You can download it at the Link below.

Download v1.0 for Joomla 1.6.x:
plg_j_webmaster_verify_Joomla1.6_v.1.0.zip

Example

Here is an example of a Joomla 1.6 Website that is using the meta tags:

Moving-Boxes-Portal.com

Let your browser display the source code to see the <meta... entries. (Ctrl+U Windows, Command+Alt+U Mac)

Installation for Joomla 1.6

1. Download the Plugin from the Link above.

2. Go to your Joomla Admin area.

3. Go to Extensions > Extensions Manager.

4. Under Install, go to Upload Package File and click "Choose File".

5. After selecting plg_j_webmaster_verify_Joomla1.6_v.1.0.zip from your harddrive, click "Upload File & Install".

6. Go into the Plugin under Extensions > Plug-in Manager.

7. Find the Plugin name System - J-Webmaster Verify and open it.

8. Enable the Plugin. Enter the verification codes of the accounts you want to verify.

9. Save and you are done.

Get the required Verification Code, Example for Google Webmaster Tools

To be able to use Google Webmaster Tools you need an Google Account, if you have a Google Mail address your are good to go.

1. Go to Google Webmaster Tools Homepage

2. Click "Add a site..." and enter the URL

3. Select "Alternate Methods"

4. Select "Add a meta tag to your site's home page"

5. Copy the part that is in between the quotes after content.

6. Paste the string into the Plugin in your Joomla 1.6 backend under Google Key.

7. Done

The other verifications should be similar.
Let me know if you have any problems or questions.

How to add the Google +1 Button to Joomla 1.6

Introduction

Recently I published a new Joomla 1.5 module for the Google +1 Button. Here now the same module for the all new Joomla 1.6. Integrate the button on your Joomla website without working in the code or change anything in the template.

Changelog/Latest Version

Joomla 1.6, Version 1.1, released June 10 2011

• show total +1 counter ON/OFF beside the +1 Button
  
• set a target URL for the +1 Button or keep the default (the page the button is embedded)
  

Joomla 1.6, Version 1.0, released June 02 2011

• change size of the Google +1 Button, small, medium, standard, tall
  
• add custom CSS with the +1 Button
  

Downloading the latest Version

You can download it at the Link below.

Download v1.1 for Joomla 1.6.x

Or check out the official Joomla Extension Website for more infos.

Example

Here is an example on how the Google Plus One Joomla Module looks in action:
Flopwatch.org

Installation for Joomla 1.6

In Joomla 1.6.x you can just install the new version as described below, there will be no conflict with an old version. In case you had one installed before.

1. Download the Module from the Link above.

2. Go to your Joomla Admin area.

3. Go to Extensions > Extensions Manager.

4. Under Install, go to Upload Package File and click "Choose File".

5. After selecting the mod_j_google_plus_one_for_j1.6.zip from your harddrive, click "Upload File & Install".

6. Go into the Module under Extensions > Module Manager.

7. Enable the Module and disable the Title. Make sure you have selected Pages it show up on.

8. Select the position and size of the button.

9. Save and you are done.

More about the Google +1 Button in a Google Video

How to add the Google Plus One Button to your Joomla 1.5 website

New update available, read below.

Introduction

I wrote a little Module for Joomla 1.5 that supports the new Google Plus One Button for your Joomla Website without working in the code or change anything in the template.

Download for Joomla 1.6

Here you can find the Download and Documentation for the Google +1 Button Module for Joomla 1.6.

Changelog/Latest Version

Joomla 1.5, Version 1.1, released June 10 2011

• show total +1 counter ON/OFF beside the +1 Button
  
• set a target URL for the +1 Button or keep the default (the page the button is embedded)
  

Joomla 1.5, Version 1.0, released June 02 2011

• change size of the Google +1 Button, small, medium, standard, tall
  
• add custom CSS with the +1 Button
  

Downloading the Extension

You can download it at the Link below.

Download v1.1 Joomla 1.5.x

Or check out the official Joomla Extension Website for more infos.

Example

Here is an example on how the Google Plus One Joomla Module looks in action:
Flopwatch.org

Installation

If you have never installed the Google Plus One module before go straight to "Install the new Version" otherwise make sure you uninstall the old version first.

Uninstall the old Version

1. Go to your Joomla Admin area.

2. Go to Extensions > Install/Uninstall.

3. Go to Modules.

4. Find and select the entry "mod_j_google_plus_one".

6. Click Uninstall.

7. Done.

Install the new Version

1. Download the Module from the Link above.

2. Go to your Joomla Admin area.

3. Go to Extensions > Install/Uninstall.

4. Go to Upload Package File and click "Choose File".

5. After selecting the mod_j_google_plus_one_1.0.zip from your harddrive, click "Upload File & Install".

6. Go into the Module under Extensions > Modules .

7. Enable the Module and disable the Title.

8. Select the position and size of the button.

9. Save and you are done.

More about the Google +1 Button in a Google Video