Mobile Joomla Tutorial

There are several ways to make sure that your Joomla site is easy to read and browser on mobile phones. Recently we wrote The Ultimate Mobile Joomla Guide which covered 5 options in detail. In this tutorial we're going to explain more about Mobile Joomla which is one of the fastest and easiest ways to make your site mobile. It is particularly useful if you already have a site template and don't want to redesign everything just to get ready for mobile phone.

Read more: Mobile Joomla Tutorial

First-ever Landing Page template for Joomla, "Impacto", now available!

ImpactoWe've just released a brand new template at Joomlashack.com called Impacto, and besides being a great all-purpose Joomla template perfect for any site, it's also the first-ever Joomla template designed to be a powerful Landing Page for your advertising campaigns!

You probably already know just how important an effective Landing Page is in today's ultra competitive, e-commerce-driven world. The right Landing page layout can increase your Adwords sales and keep visitors on your site longer. And that's why Impacto is so..impactful. Impacto enables you to build stunning landing pages right inside Joomla! using bold, rich typography, preset styles, and customizable layout options that present your message clearly and effectively.


Read more: First-ever Landing Page template for Joomla, "Impacto", now available!

The Ultimate Mobile Joomla Guide

One of the most common questions we get from our Joomla training students now is: "how do I make my Joomla site ready for mobile phones?"

There are two different ways to do this and the choice depends largely on whether you have a template or not.

  1. Template Frameworks. If you're looking for a template, choose one of the designers whose templates automatically adjust for mobile browsers. Click to visit this section.
  2. Template plus plugin: If you already have a template, there are systems that will provide both the mobile template and a plugin to detect when someone is visiting from a mobile phone. Click to visit this section.

Here is a guide to the different ways to make your site mobile and at the end we'll show you how to manage and update your site from your phone.

Read more: The Ultimate Mobile Joomla Guide

Pop-up Messages in Joomla using JDialog

One of our Joomla training members wanted to place an agreement in front of their users on certain pages. They wanted to force them to agree before going any further.

Our solution was the JDialog module. This works not just for agreements but for almost any type of pop-up message you want to display.

Read more: Pop-up Messages in Joomla using JDialog

Showing Different Content to Different Joomla Users

One of our Joomla training members asked this question: "I need to give access to certain login individuals to specific content."

Now, there are Joomla extensions that will close off different parts of the site to different groups of users, but this member wanted something different. They wanted to drill down much more accurately and show different content to different individual users, even within one article.

To do this you need the "inline ACL Content Plugin" and here's how you use it.

Install inline ACL Content Plugin

tutuploadsmedia_1287949431709.png

Visit the inline ACL page on https://extensions.joomla.org. Click "Download" to go to the developer's site and find the file. Download the file to your desktop.

In your Joomla administrator area, go to Extensions >> Plugin Manager and enable the plugin.

Different Content to Different Joomla Users

tutuploadsmedia_1287950737037.png

In order to test out the inline ACL plugin, I went to Site >> User Manager and create three different users. Take note of their username and also their number in the right-hand column called "ID". You'll be able to use either the username or the ID# to show users different content:

tutuploadsmedia_1287950775837.png

Create The Content For Each User

tutuploadsmedia_1287951062823.png

Go to Content >> Article Manager and open up and article that you want to place content inside.

Use this formula for the code:


 {iACL type=username testa}Hi testa!{/iACL}

{iACL type=username testb}Hi testb!{/iACL}

{iACL type=username testc}Hi testc!{/iACL}

When the "testa" signs in, they will see "Hi testa!". When "testb" signs in, they will see "Hi testb!" and so on.

You can also do this by using the ID#s:


 {iACL type=userid 62}Hi testa!{/iACL}

{iACL type=userid 63}Hi testb!{/iACL}

{iACL type=userid 64}Hi testc!{/iACL}

When the user with ID# 62 signs in, they will see "Hi testa!". When the user with ID# 63 signs in, they will see "Hi testb!" and so on.

If you want to show content only to unregistered users, use this:


 {iACL type=userid 0}Hi unregistered users!{/iACL}

Other Options Using inline ACL

{iACL type=!userid 62}Your text{/iACL}
the content between the tags is invisible for the users with the specified IDs. Again you can target unregistered users by using ID# 0.
{iACL type=!username testa}Your text{/iACL}
the content between the tags is invisible for the users with the specified usernames.
{iACL type=group author,guest}Your text{/iACL}
the content between the tags is visible for the specified groups only. Possible values are: guest, registered, author, editor, publisher, manager, administrator, super administrator, special
{iACL type=!group author,guest}Your text{/iACL}
the content between the tags is invisible for the specified groups. Possible values are: guest, registered, author, editor, publisher, manager, administrator, super administrator, special

Using JComments with K2

We've written often about K2, the excellent content extension for Joomla. You can read and watch our introductions here in Part 1 and Part 2.

In this tutorial we'll show you how to use JComments instead of native K2 comments. Why would you want do this? Here are some reasons:

  • JComments is a more fully-featured commenting option than the default K2 option.
  • JComments can provide comments elsewhere on your site, not just K2. Your site visitors will be presented with a unified solution.
  • It has a captcha system that works on all hosts unlike Recaptcha which can cause problems on hosts such as GoDaddy.

Install K2 and JComments

tutuploadsmedia_1287580994514.png

In order to integrate K2 and JComments you first need need to have both of them installed on your site.

If you haven't done so, you can find them on the K2 page on https://extensions.joomla.org and the JComments page on https://extensions.joomla.org.

tutuploadsmedia_1287581036579.png

Install the JComments for K2 Plugin

tutuploadsmedia_1287580965511.png

In order to integrate the two extensions, we're going to need the JComments for K2 plugin that you can download from its page on https://extensions.joomla.org.

Upload this plugin to your Joomla site and then go to Extensions >> Plugin Manager >> K2 JComments Plugin and enable it.

Visit Your K2 Articles

tutuploadsmedia_1287581614458.png

That's it, you're done. Unfortunately it's not possible to import your K2 comments into JComments.

October Template: Introducing "Cloud 9"- Joomlashack's newest Joomla Template

Cloud 9 Joomla TemplateThis week, we're on 'cloud nine' over the release of our latest Joomla template called...what else? Cloud 9!

Cloud Nine = A state of happiness, ecstasy, elation or bliss.

Cloud 9 is a clean and colorful template as big, blue, and spacious as a Montana sky.

Cloud 9's sparse and modern design makes it the ideal template for a blog, personal site, or social networking site--where users want easy access to content...not clutter! And Cloud 9's no-bloat, SEO-optimized code will have your visitors ecstatic over how fast your site loads.

You'll be ecstatic, too, when you see all the cool additions and features we've packed into our Cloud 9 joomla template...

Read more: October Template: Introducing "Cloud 9"- Joomlashack's newest Joomla Template

Add a Toolbar to Joomla with UserToolbar

One of our Joomla training members asked us if there an extension that can create a "facebook style footer admin panel" like the one found at the bottom of Facebook.com.

The answer is yes, thanks to an extension called UserToolbar.

Download and Install UserToolbar

tutuploadsmedia_1287426846577.png

Go to the UserToolbar page on the Joomla Extensions Directory site and click Download.

tutuploadsmedia_1287426945776.png

You'll be taken to Joomlacode.org. Click on the link under "Files" and a file will be sent to your computer.

tutuploadsmedia_1287427068376.png

In the administrator area of your Joomla site, go to Extensions >> Install/Uninstall and click Browse. Find the file you just downloaded and then click Upload FIle & Install.

tutuploadsmedia_1287427172749.png

You should see a Congratulations message show that you've installed the component successfully.

Configuring UserToolbar

tutuploadsmedia_1287427208305.png

Once you've installed the component, go to Components >> UserToolbar >> Button List

tutuploadsmedia_1287427296707.png

Click New in the top-right corner.

tutuploadsmedia_1287427458097.png

Here you can choose what you'd like to add to the toolbar on your site. In this example we'll choose an Internal Link.

tutuploadsmedia_1287427476902.png

Next we'll click on Articles, but in reality we could choose any element of our site.

tutuploadsmedia_1287427547535.png

Click Article Layout just as you would when creating a menu link.

tutuploadsmedia_1287427594462.png

You'll now see a very slightly modified version of the menu creation page. You can click on Select Article to find the page you want to link to. You can also enter a name that people will see on the front of the site. Finally, click the Icon link to choose from the default images or upload your own.

tutuploadsmedia_1287427612727.png

Adding a Login Box to UserToolbar

tutuploadsmedia_1287428472230.png

In this next example we're going to add a login module to the toolbar. In Components >> UserToolbar >> Button List >> New you can choose to add a Module.

tutuploadsmedia_1287428506284.png

Choose Login on the next page.

tutuploadsmedia_1287428593449.png

Now you'll see a modified version of the Login Module page. You can set a name and choose an icon as before. Save your choices.

Viewing the Toolbar

tutuploadsmedia_1287428610869.png

Visit the front of your site and your toolbar will look like the one above. You can add many more items, linking to almost any page on your site or someone else's site. A common use for these toolbars is to add contact links plus social website links such as Facebook and X / Twitter.

tutuploadsmedia_1287428643543.png

Click on the Login link and you'll see the login box displayed in a pop-up.

Creating Splash Pages in Joomla with SplashR

Normally I'm no fan of splash pages for some of the reasons outlined here by SEOMoz.

However, quite a few of our members have wondered how to set them up and sometimes clients do insist on them.

Splash pages are not very straightforward to do because Joomla always tries to load it's own pages first. In order to avoid this, we can use a module called SplashR:

Install SplashR

tutuploadsmedia_1286309022540.png

Go to the SplashR listing on the Joomla Extensions Directory and click Download.

Go to the administrator area of your site then Extensions >> Install/Uninstall, click Browse and upload the module file.

Then go to Extensions >> Module Manager and open up the SplashR module.

Edit the Module Settings

tutuploadsmedia_1286309515308.png

There are several settings you'd need to change here:

  • Splash URL: the page you want to use for the splash screen.
  • Splash Title: telling people what site they're visiting.
  • Autohide Timer: setting this to 0 forces people to click through to your main site.
tutuploadsmedia_1286309562690.png

Once you enable the module, visitors to your site will see a screen like the one above. There will be a black bar across the top of the screen and a button in the top-right corner.

If you'd like to edit the design of the splash controls, go to this folder to replace the images: /modules/mod_splashr/assets/images/

Simple Subscribe: Joomla Subscription Extension

There are many great subscription extensions available for Joomla. However they tend to be very powerful and complex to setup. Some of our members have been asking for a very, very simple membership component. Simple Subscribe is it.

It doesn't do recurring subscriptions, lock down particular areas of the site or use anything except PayPal.

Basically Simple Subscribe allows people to pay a flat fee to become a Registered member of your site. That's it. If that works for you then Simple Subscribe is a great option. If not, click the link above a search for an extension with more features.

Installing Simple Subscribe

tutuploadsmedia_1286208047368.png
tutuploadsmedia_1286208098072.png

There should be a huge download button on the developer's website. Download the file to your desktop and then go to Administrator >> Extensions >> Install/Uninstall to upload the extension.

Configuring Simple Subscribe

tutuploadsmedia_1286208202332.png

Configuring Simple Subscribe is easy. Go to Components >> Simple Subscribe. Then enter your PayPal information, the cost of membership and the currency code. If you aren't sure what the right code for your currency is, check this list.

tutuploadsmedia_1286208349645.png

Next you'll need to make a sign-up link for people. Go to Menus >> Main Menu and click "New".

tutuploadsmedia_1286208392509.png

Choose "Simple Subscribe" and "Default Layout" from the dropdown menu.

tutuploadsmedia_1286208439188.png

Give the menu link a title such as "Join Our Site" and then click "Save".

Registering People

tutuploadsmedia_1286208520112.png

As soon as people click "Subscribe" they will be taken to PayPal where they can complete their subscription.

Extra Fixes Needed #1

tutuploadsmedia_1286210402659.png

There are a couple of extra fixes you'll need to make to make Simple Subscribe work perfectly. First, we're going to prevent people from registering without paying. Go to Extensions >> Module Manager and disable the "Login Form" module.

tutuploadsmedia_1286210165605.png

Instead of the default login module, we're going to use the Core Design Login Module. You can download it using the previous link to the Joomla extensions site. Download the file to your desktop and upload it via Administrator >> Extensions >> Install/Uninstall

tutuploadsmedia_1286210503096.png

Go to Extensions >> Module Manager >> Core Design Login module and open that module.

Under "Advanced Parameters", set "Define Links" to Custom - specify below". This means that people can't use the normal Joomla registration system to pay. They have to go through Simple Subscribe. In the "New Account Link" field you can enter this: index.php?option=com_simplesubscribe&view=register

Extra Fixes Needed #2

There is a small language mistake that appears on the Simple Subscribe registration screen.

To fix it, go to this file /components/com_simplesubscribe/views/register/tmpl/default.php

You'll need to find this line at the bottom of the file:

<?php echo JText::_( 'REGISTER_REQUIRED' ); ?>

Either remove the line entirely or change the "REGISTER_REQUIRED" so that it reads "Required fields are marked with a *"