Special 2018 Offer! Get access to everything at OSTraining for one year! Only $59!
  Offer ends in 1
3 out of 4 members use OSTraining at least once a week. You can build great websites. We can help.   Plans from $4 per month

| Joomla

If you run a website that allows registration, you're probably familiar with the parade of fake addresses that people use: mickymouse [at] hotmail.com, email [at] email.com and so on. You've also seen spam addresses often ending in .ru, .biz, info or similar.

This week we're going to show you how to check registration emails to make sure they are using legitimate. This can cut down on the number of spam comments, forum posts and other submissions you have to deal with.

We're going to use a plugin called Registration Validator. Here's how you do it:

  1. Register for an account at CEDit.biz and confirm your account.
  2. Log in and Download the Registration Validator plugin.
  3. In the administration area of your Joomla site, go to Extensions >> Install / Uninstall and upload the file.
  4. In the administration area of your Joomla site, go to Extensions >> Plugin Manager >> System - Registration Validator and enable the plugin.
  5. Inside the plugin you can change the settings.

Once the plugin is enabled your registration form will have add another layer of protection to your site from spammers.

| Joomla

One of the most famous blogging experts is Brain Clark on Copyblogger. He recently wrote a post about the “Click Here problem”.

He quotes research that shows how often people click on different kinds of link:

  • Click to continue”: 8.53%
  • Continue to article”: 3.3%
  • Read more”: 1.8% backend.png

The main problem is that "Read More" doesn't tell people what to do or what they'll be reading about. Well, you can probably guess which of these options Joomla uses by default.

Fortunately, it is possible to make Joomla's Read More more descriptive and useful.

Here's how you do it:

  1. Go to the administrator area of your site and Content >> Article Manager.
  2. In the parameters of your article, under 'Parameters(Advanced)', enter the text you would like the article to use for the Read More link. If you leave this field blank, Joomla will use the default "Read More".
  3. This is how it will look on the front end of your site:

frontend.png

 

 

 

 

 

 

 

 

If you don't want to do this yourself for every article, both sh404SEF and SEF Advance are components that will optimize your URLs and also insert the article title into the read more link. Finally, if you're not using either of those, click here to find a code hack available to insert the title automatically (notice what we did? Wink ).

| Joomla

The favicon is the small image that people use to identify your site. It appears in their bookmarks, in their browser bar and in any tabs that they have open:

Favicon With Joomla

By default, Joomla uses the official Joomla logo. Here's how to change the image to something that reflects your website:

  • Step 1: Find the image that you'd like to use. The best favicons are normally square and don't have a great of detail.
  • Step 2: Either resize the image yourself to 16 pixels high and 16 pixels wide, or you can use a website such as http://www.favicon.cc to resize it for you.
  • Step 3: Make sure that the image is called favicon.ico
  • Step 4: You will need to upload the image via FTP or your favorite file manager. The location you need to upload to will look like this /templates/your-template-name/. That's all. You don't need to place it in your template's images directory or even Joomla's image directory. Just place it in your template's main folder.

A Note of Caution:

Many browsers use "caching" which means they show a version of the page from several minutes ago. That means that your browser may not show your new favicon immediately. You may need to delete your browser cache (instructions are here) and restart your browser to see the change.

| Joomla

In our beginner classes we explain a Joomla quirk ... all images should go in the /images/stories folder to make them easier to use. However, some people are taking over sites where that hasn't been done. Here's how to change the place where images are put:

  • Step 1: Login to the administrator area of your Joomla website.
  • Step 2: Go to Site >> Global Configuration.
  • Step 3: Global Configuration is divided into 3 sections: Site, System, and Server. Click on "System".
  • Step 4: Scroll down to "Media Settings".
  • Step 5: In the field "Path to Image Folder", change where you'd like images to be placed. It is most likely that'll you want to change this from /images/stories to just /images/
  • Step 6: Click Save.

How to Change the Image Folder in Joomla

| Joomla
Well, almost any template. This tip works for all but the most complicated templates.

  • Step 1: Go and download the Firefox browser, if you haven't done so yet: http://www.mozilla.com/en-US/firefox/personal.html. Firefox is much better than Internet Explorer or Safari for working on websites.
  • Step 2: We're going to install an extra toolbar for Firefox. It is called the "Web Developer" toolbar. It was already installed on the Firefox we used in the Joomla beginners classes: https://addons.mozilla.org/en-US/firefox/addon/60
  • Step 3: Click "Add to Firefox" and follow the instructions, including restarting Firefox.
  • Step 4: The next time you open Firefox, you will see a list of links that starts with "Disable", "Cookies", "CSS" and ends in "Options"
  • Step 5: Browse to the website where you want to change the logo. We're going to use http://joomla.org for this example.
  • Step 6: In the toolbar, click on "Images" which is the 5th link from the left. Then click "View Image Information" from the dropdown.
  • Step 7: You will now see a list of all the images on the site.
  • Step 8: Scroll down until you see the logo. You will see two pieces of information about it: Location ( http://cdn.joomla.org/images/logo.png ) and Size ( Width = 235 pixels, Height = 40 pixels ).
  • Step 9: You need to make a new logo that is the same width and height as the old.
  • Step 10: Use your favorite file manager to upload the new logo to the location you found in Step 8. It is better to rename rather than delete the old logo. You could call it logo-backup.png for example.

| Joomla

People often ask "what's the best blog extension for Joomla?". Our answer: "how about Joomla itself?".

We use Joomla for our blog on alledia.com and get 10s of 1000s of visitors every month. Here's how to set up a blog using Joomla:

  • Step 1: Go to Content >> Section Manager and make a section called "Blog".
  • Step 2: Go to Content >> Category Manager and make categories for your blog. Make sure to assign them to the "Blog" category.
  • Step 3: Go to Content >> Article Manager and write the first few articles for your blog. When you're writing each article, be sure to click the "Read More" button at the bottom of the page to insert the red line. This will create an intro text for the article. Everything before the red line will be the intro. To get to the rest of the article, people will need to click "Read More".

How to Create a Blog Using Joomla

  • Step 4: Go to Menus >> Main Menu >> New >> Articles >> Section Blog Layout and choose the "Blog" section that you created in Step 1.
  • Step 5: Go to the front of your site and click on the new link. If you don't like what you see, you can go back to the menu link from Step 4 and change the "Parameters" on the right-hand side. Common things to change are the number of articles on each page and the number of columns.

Adding Comments

If you'd like to allow people to leave comments to your blog, click here and follow the instructions.

| Joomla
  • Step 1: Go to the RSS Feeds section on Joomla.org.
  • Step 2: Download the Ninja RSS Syndicator.
  • Step 3: Install Ninja RSS via the Joomla installer.
  • Step 4: Go to Components >> Ninja RSS and click "New"
  • Step 5: Fill in the information requested. Most of this fields are self-explanatory. You can happily just give your feed a name and click save.

BCA RSS Feed

Collecting Data on Your RSS Feed

  • Step 6: After you've saved your feed, copy the URL or save it into a text editor.
  • Step 7: Go to http://feedburner.google.com and login.
  • Step 8: Enter the URL for your RSS feed into this box:
RSS Feedburner
  • Step 8: Give your feed a name and URL. Make sure to write down the name of your new feed URL.
  • Step 9: Over the next few weeks, you can login back into Feedburner and see detailed information about how many people are subscribing to your feed:

RSS Statistics

Allowing Search Engines and Visitors to Find Your RSS Feed

  • Step 10: Add this to the head of your template:
    <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://feedaddress.com" />
  • Step 11: Go to https://siteexplorer.search.yahoo.com/submit and submit your RSS feed.

| Joomla

In our classes we've talk about the SCAM workflow that makes building Joomla 1.5 websites much easier:

  • S: Go to Section Manager and create sections
  • C: Go to Category Manager and create categories
  • A: Go to Article Manager and create articles
  • M: Go to Menus and create menu links

That 4-step process is the key to building a site. A lot of people's confusion with Joomla comes from not knowing about that workflow. They try to create articles first and then realise they have no way to organize them. Or they create sections, categories and articles then wonder why they aren't visible on the site (they haven't made a menu link so that people can see them).

But what if this workflow could be done much more quickly? That's what we're going to explain in this tutorial using a component called MassContent.

  • Step 1: Go to Baticore.com and download Mass Content via this link.
  • Step 2: Go to Extensions >> Install / Uninstall and install the file (called com_masscontent)
  • Step 3: Go to Components >> Mass Content >> Create Mass Sections
  • Step 4: Enter the titles for all your sections, check the box saying "Copy Title to Alias" and then click Save.
How to Create a Joomla Site Quickly
  • Step 5: Go to "Create Mass Categories" and repeat the process. Make sure you put the categories in the correct section, using the dropdown on the right-hand side.
How to Create a Joomla Site Quickly
  • Step 6: Go to "Create Mass Content".
  • Step 7: Click on "Parameters" in the top-right and choose your setting. How many articles do you want to create? Do you want to use the WYSIWYG editor?
  • Step 8: Write your articles. You can either just write the title and fill in the rest later or you can actually create the full articles directly from this screen.

Video on How to Use Mass Content

| Joomla

This is a very simple trick that many people seem to miss ... you can create your own module positions from inside of Joomla. Here's how to do it:

  1. Go to Extensions >> Module Manager and open up any module. You'll see page looking like this:
    How to Create New Joomla Module Positions
  2. Place your cursor in the "Position" box and hit backspace. You'll be able to delete the position name:
    How to Create New Joomla Module Positions
  3. Type in the name of the position that you'd like to create:
    How to Create New Joomla Module Positions
This makes life much easier if you want to use other techniques using modules, including placing modules into articles.

| Joomla

Most of our ideas for tutorials come from people's requests and this is no exception. Someone asked me the other day ... "How can I really see what an article is going to look like when I publish it?".

Normally, if you're writing an article and click Joomla's "Preview" button you get a plain white page with no template, no modules and no styling. The real-life page will look very different. So, here's how to get a really good preview of Joomla articles:

We're going to use a plugin called (appropriately) Better Preview. Here's how you do it:

  1. Download the Better Preview plugin from NoNumber.nl.
  2. In the administration area of your Joomla site, go to Extensions >> Install / Uninstall and upload the file to install. The plugin will publish automatically.
  3. Go to write a new article and a button saying "Preview" will appear in the top-right of your screen.
  4. Click that link to see the article with the correct template, modules and styles.

One extra benefit is that you'll also be able to see the URL of page. Joomla's normal preview appears in a pop-up so you don't know where it will be located.

| Joomla

One question we frequently get is about the Joomla contact form. Some people think its too plain and want to redesign it or add features. Some people get too much spam.

This week we'll walk you through how to improve your contacts component, including adding new fields and the anti-SPAM Captha system to your contact forms.

We're going to use a component called QContacts. Here's how you do it:

  1. Download the QContacts component from Latenight-coding.com.
  2. In the administration area of your Joomla site, go to Extensions >> Install / Uninstall and upload the file to install.
  3. If you already have contact categories and contacts set up, you can import them: In the administration area of your Joomla site, go to Components >> QContacts >> Tools and click on Execture in the 'Import Contacts' to import your contact categories and contacts.
  4. Go to Menus >> Main Menu, click New and you can choose QContacts as an option to start seting up links to your contacts.

The real power of QContacts can be found by going to Components >> QContacts >> Contacts and clicking on the "Parameters" button in the top-right. You can choose to add an anti-SPAM Captcha system or to redesign your form in all sorts of ways.

Taking QContacts Further

Be sure to also download the Search Plugin from the Latenight-coding site to allow searching of your contacts. Once downloaded you will install the plugin just as you did the component in step 2 above.

The creator of the component also offers complete documentation which you may find very helpful.

| Joomla

Following on the newsletter from last week where we talked about developing locally and moving your site to a live server, this week we're going to walk you through installing Joomla locally, on a Mac.

We're going to use MAMP for this tutorial.

Here's how you do it:

  1. Download and install MAMP to your Applications directory.
  2. Download the latest Joomla 1.5 zip file.
  3. Start MAMP by double clicking on the MAMP icon in your Applications/MAMP directory.
  4. Once the servers have started, a browser window should open to the MAMP start page. If not, click on the 'Open start page' in the MAMP window.
  5. Set up your database for Joomla by clicking on the phpMyAdmin link in the start page and inserting the name you wish to use for your database in the 'Create new database' field. **For all databases created in MAMP the default username / password is: root / root, and the Host Name that you will use when installing Joomla is: localhost.
  6. Copy/move the downloaded version of Joomla 1.5 to your Applications/MAMP/htdocs directory and unzip the file. Leave a copy of this zip file in the htdocs directory for easy creation of multiple Joomla sites ... just unzip the file each time you wish to have a new Joomla installation!
  7. Rename the unzipped folder to mysite (or whatever you wish).
  8. In your broswer navigate to http://localhost:8888/mysite (or whatever name you gave your directory).
  9. Run through the Joomla installation process and voila! (need help installing Joomla? See: http://help.joomla.org/content/category/48/268/302/)

You should now have a shiny new installation of Joomla on your Mac where you can develop your website securely in your local environment.

Video Showing How to Install Joomla Locally on a Mac

| Joomla

Often you have pages on your website that you want to keep private - either for your staff or for you registered members.

This week we'll walk you through how to keep search engine bots from indexing certain articles.

Method #1

    Registered Joomla
  1. In your Joomla Admin panel, go to Content >> Article Manager and open the article you wish to keep private.
  2. On the right-hand side under "Parameters (Article)" you will see a field labled "Access Level".
  3. If you set this to "Registered" then only people at the "Registered" user level and above will be able to see the article.
  4. If you set this to "Special" then only people at the "Author" user level and above will be able to see the article.
Click here to see a list of the different Joomla user levels and what they can do.

Method #2

  1. Nofollow JoomlaIn your Joomla Admin panel, go to Content >> Article Manager and open the article you wish to keep private.
  2. On the right-hand side under "Metadata Information" you will see a field labled "Robots".
  3. You can write "noindex" into this box and search engines should recognize that this page should not be indexed

To verify that this has worked, visit the secret page on the front of your site and click "View Source" in your browser. If everything has worked correctly you should be able to see a line in the code looking like this:

< meta name="robots" content="nofollow" / >

(we've added spaces around the < and > signs so you can see the code)

| Joomla

This week we'll walk you how to manage the files on your server through your Joomla Admin, using a Joomla component.

We're going to use a component called NinjaExplorer

Here's how you do it:

  1. Download NinjaExplorer
  2. In the administration area of your Joomla site, go to Extensions >> Install / Uninstall and upload the file.
  3. In the administration area of your Joomla site, go to Components >> NinjaXplorer and you will have access to your server directories and files.

This tool can be used to upload files, delete files and edit files (amongst other things) just as you would do with an FTP client.

Be sure you don't delete anything you don't know the purpose of - and this is a good time to remind you to back up your site regularly! (see our newsletter on moving your site from local to live server and use the technique mentioned to back up your site).

| Joomla

Many people like to develop their Joomla sites locally and then move their work to a live host when completed. This weeks tutorial will show you how to move an exact copy of your site from your localhost to a live server, database and all.

We're going to use a fantastic component called Akeeba Backup to help us with the process. We'll first use it to make a backup of our local site (files + database), and then we'll use a provided tool (Kickstart) to restore the backup to our live server.

Here's how you do it:

  1. Download the Akeeba Backup component. Make sure you get the latest release, which at the time of this newletter is 2.2
  2. Download the Kickstart app, again making sure you ge the latest release, 2.2Stable - unzip the package for later use.
  3. In the administration area of your local Joomla site, go to Extensions >> Install / Uninstall and upload the Akeeba Backup component file: com_Akeeba Backup-2.2-free.zip
  4. In the administration area of your local Joomla site, go to Components >> Akeeba Backup >> Configuration and we're going to change a setting before we backup and migrate. Click on the 'Advanced' tab and then locate the 'Archiver engine' and change it to 'JPA Akeeba Backup Archive, and click Save.
  5. Click on the Backup Now button (you'll notice a warning regarding the default directory being used for the backup - we can ignore this *for now) and then the 'Backup Now!' You should see the backup process begin, and be given a success page when completed.
  6. Locate the backup file in your localhost joomla_root/administrator/components/com_Akeeba Backup/backup - the backup file will have the extension .jpa. Upload this file to the directory on your live server where you will do the restore. For most this will be the root directory, /html or /home etc
  7. Upload the Kickstart app file to this same directory. You should have unzipped the package in an earlier step, if not, unzip and then upload the file.
  8. Create a new database using phpMyAdmin or the tool provided by your host to do so. This new database will be used for our restore to populate with our backed up data. Make note of the hostname, username/password and database name for further steps.
  9. Navigate in your browser to http://backup_directory/kickstart.php (where backup_directory is the directory your backup file is located). Insert your Host, Username, and Password information and click on the green Start button. You will see the process beign - do not close this browser window!
  10. Once the file extraction is done you will see a message to 'Please click here to open Akeeba Backup Installer restore script in a new window'. Click there.
  11. A new window will open, and you will see a typical looking Joomla installation page, however this is the restore script. Go through the installation process, making sure you put your new information for hostname, username, password and database in Step 4.
  12. After successful Joomla installation (restore in our case) go back to the other browser window and click on the link to restore your .htaccess file if you need to do this step, and close the browser window when done.
  13. The restoration process should now be completed, and you can log in to your newly moved site at /administrator to continue development on the live server.

| Joomla

This tutorial is a response to a question we've been asked often in classes:

"How can I resize images as I upload them?"

We're going to recommend Image Resize. It works so naturally with the Joomla workflow that most people don't even notice it. Here's how to use it:

  • Step 1: Visit Joomlaforge.net and download the file called plg_imageresize_v.5.zip
  • Step 2: In the administration area of your Joomla site, go to Extensions >> Install / Uninstall and upload the file.
  • Step 3: Go to Extensions >> Plugin Manager. Find "Image Resize" and enable it.
  • Step 4: Go to Content >> Article Manager and edit an article.
  • Step 5: Click on the image link at the bottom of the article and upload an image. Insert it into the article.
  • Step 6: Select the image and drag the corners until the image is the size you want it to be.
  • Step 7: When you view the article on the frontend, Image Resize does all the work for you and creates a new version of your image!
3 out of 4 members use OSTraining at least once a week. You can build great websites. We can help.   Plans from $4 per month