Home Classroom Joomla

1579

Change Your Joomla Database Login

This article we will show you how to change or verify the database login to your Joomla site. You will sometimes need to do this if:

  • Their site can’t access the database
  • They’ve been hacked and need to make the site more secure

Login to Your Hosting Account

 

Access Your Database Area

 

Create a New Database User

Be sure to take a careful note of your password.

 

Add the New User to Your Database

Make sure to choose the correct user and the correct database, then click “Add”.

 

Give the New User All Privileges

 

Login to Your File Manager

 

Open Configuration.php

This is the file that connects your Joomla files to your database. It needs to have the correct username and password.

 

Update the User and Password Details

Scroll down until you see the $user and $password fields. Insert the information you created earlier. Then click “Save” and check the front of your site to ensure everything is working correctly.

Your valuable comments after reading this article will be highly appreciated. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get the assist.

1222

Blog style view – Daily blogs

This Joomla layout override article shows you how to modify the blog style views for articles to show the “day” date above all the articles posted in the same day. After that, each article on the same day will just display the time they were posted as shown in the screenshot.

The steps are easy to follow or you can just download the files via the link at the end of the article.

We are going to do our layout override example on the “category” view in com_content – that’s the component that controls the way all your articles display on your site. We don’t want to modify the original files because we risk losing our changes each time we upgrade the Joomla source files. So what we do is copy the original blog layout file to a layout override folder in the default template you are using for your Joomla site, as follows:
Copy: /components/com_content/views/category/tmpl/blog_item.php

to: /templates/rhuk_milkyway/html/com_content/category/blog_item.php

Open the new blog layout override file, blog_item.php, in your favourite editor and change the top of the layout override file to the following:
<?php // no direct access
defined('_JEXEC') or die('Restricted access');

// Set up some variables
$fDate = JHTML::_('date', $this->item->created, '%B %d, %Y');

// Remember which dates we have used
if (!isset($this->usedDates)) :
$this->usedDates = array();
endif;

// Have we already shown it?
$showDate = !isset($this->usedDates[$fDate]);

// Now set that we've used it
$this->usedDates[$fDate] = true;
?>

What we are doing in this block is storing a new, formatted “day” date in the variable $fDate. You can change the way for date looks by changing the third argument. See the PHP Manual for strftime for other things you can add to the formatted date (you want to concentrate on the table with all the letters with a %-sign in front of them – it’s a bit weird but just go with it).

Next we are setting up an internal view variable called userDates to track the dates that we have displayed. After that we work out if we are to show the date and put that in a variable called $showDate.

To start putting this together, find <table> tag a few lines down. If we are displaying the date, we will be adding a new row to the table, as follows:

That will display the “day” date above the first article in the “day”.

Lastly we want to change the article date that is displayed to only show the time. Go down one hundred or so lines in the override file and find this line:
<?php echo JHTML::_('date', $this->item->created, JText::_('DATE_FORMAT_LC2')); ?>

You need to change it to this:
<?php echo JHTML::_('date', $this->item->created, '%H:%M %Z'); ?>

You can adjust any of the code in the layout override outlined above to suit your own requirements or your own template. Most templates won’t be displayed with in a table (generally considered bad form nowadays) so you won’t have to worry about putting the “day” date in a table row. Place it in a div or whatever other tag you are happy with. Likewise, change the h3 tag to whatever suits.

The Joomla “section” and “frontpage” views can also be altered in a similar fashion with separate layout override files. For best results you would use a single column display. It might look at bit weird in two or more columns. I’ve zipped all the Joomla layout override files for easy download. To install them, unzip the files into the /html/ folder in your default Joomla template. Remember to backup any files and folders that already exist (just in case).

Your valuable comments after reading this article will be highly appreciated. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get the assist.

The next article will discuss about Database in Joomla.

1381

Layout Overrides: Popup Login Box

Login boxes can take up valuable space on your web site, or just detract from the overall feel of the site. A popular technique for addressing this problem is to show a modal popup login box. The idea is that you replace the page hungry username and password fields with a “login” link that, when clicked, opens a modal popup login box. This can all be achieved out-of-the-box with Mootools and Joomla layout overrides.

In this Joomla development article we will be using two simple layout overrides for the login module and the user component’s login page. Our first step is to create is to copy the native layouts to the layout override folder in the active template.

Copy:
/modules/mod_login/tmpl/default.php

to:
/templates/template_name/html/mod_login/default.php

and copy:
/components/com_user/views/login/tmpl/default_login.php

to:
/templates/template_name/html/com_user/login/default_login.php

Where template_name is the folder name for the default template used on your site. If you use more than one template, linked to menu items, then you will need to create the layout overrides for each template. Your folders should look something like the image to the side.

Open the login module layout override first (/html/mod_login/default.php). Replace the code with the following listing:

<?php // no direct access
defined('_JEXEC') or die('Restricted access'); ?>

<?php if ($type == ‘logout’) : ?>
<form action=”index.php” method=”post” name=”login” id=”form-login”>
<?php if ($params->get(‘greeting’)) : ?>

<div>
<?php if ($params->get('name')) : {
echo JText::sprintf( 'HINAME', $user->get('name') );
} else : {
echo JText::sprintf( 'HINAME', $user->get('username') );
} endif; ?>
</div>

<?php endif; ?>

<div align="center">
<input type="submit" name="Submit" value="<?php echo JText::_( 'BUTTON_LOGOUT'); ?>" />
</div>
<input type="hidden" name="option" value="com_user" />
<input type="hidden" name="task" value="logout" />
<input type="hidden" name="return" value="<?php echo $return; ?>" />

</form>
<?php else :
JHtml::_('behavior.modal', 'a.login');
?>
<script type="text/javascript">
window.addEvent('domready', function() {

// Decorate the login windows to use a modal.
$ES('a.login').each(function(a){
a.setProperty('rel', '{size: {x: 175, y: 225}, ajaxOptions: {method: "get"}}');
if (a.getProperty('href').contains('?')) {
a.setProperty('href', a.getProperty('href')+'&tmpl=component');
} else {
a.setProperty('href', a.getProperty('href')+'?tmpl=component');
}
});

});
</script>

<p>
<a href="<?php echo JRoute::_('index.php?option=com_user&view=login'); ?>"
class="login" title="<?php echo JText::_('LOGIN') ?>">
<php echo JText::_('LOGIN') ?></a>
&bull;
<a href="<?php echo JRoute::_( 'index.php?option=com_user&task=register' ); ?>">
<?php echo JText::_('REGISTER'); ?></a>.
</p>

<?php endif; ?>

The display for the module when logged in is unchanged. But when not logged in only two links will be displayed: the login link and the register link. On the login link, a class of “login” has been applied. A small amount of unobtrusive Javascript has been used to add a modal popup on any anchor tags with a class of “login”. This technique degrades gracefully in the event that Javascript is disabled (so on a handheld device, clicking on the link will just take you to the normal login page).

Before we started, the login box will have looked something like the following image.

After creating the layout overrides, the display will change to something like the following image:

When you click the login link it will open the model popup login box. The description is still being displayed in the popup, so let’s look at taking that out (but still leaving it in if the full login page is displayed).

Open the login module layout override first (/html/com_user/login/default_login.php). Where the login description is being displayed, wrapped it in and if block to only display if it is being shown in a popup, as follows:

<?php if (JRequest::getVar('tmpl') != 'component') :? >
<div>
<?php echo $this->image; ?>
<?php if ( $this->params->get( 'description_login' ) ) : ?>
<?php echo $this->params->get( 'description_login_text' ); ?>
<br /><br />
<?php endif; ?>
</div>
<?php endif; ?>

The tmpl request variable is reserved in Joomla. If it has a value of “component” then we know that the outer site template is not being displayed (this happens in several places in Joomla, such as the “print” view in articles).

The final result will look something like the following image after we click on the “Login” link:

Those are the basic principles for creating an unobtrusive login box. You can download the layout overrides shown from joomlacode.org: popup_login_box_layout_overrides.zip. To install them, unzip the files into the /html/ folder in your default Joomla template. Remember to backup any files and folders that already exist (just in case).

Your valuable comments after reading this article will be highly appreciated. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get the assist.

The next article will discuss more about Layout Override in Joomla.

1131

How to Edit Your CSS and HTML Files on Your Joomla Web Site

Your Joomla web site uses CSS to keep the text, background colours, module header colours, headings, etc the same throughout your site. If you want to change the colour of your content headings, your text, or background page colour, you would do this from the CSS file. You can also change the colours of your links, the background of your menus, or the name of image files that show up.

The HTML tells your template where to pull modules in, and includes the footer text on your template (depending on your template). If you want to change the footer text on your template, this is the place to do it. Also, some templates have some alternate options in the HTML file such as making your template right justified, centred, or left justified. Some also allow you to change whole colour schemes from the HTML file. Generally, this is found in templates you buy and the template will come with instructions on how to switch between the different options in the HTML file. It’s usually as easy as typing the name of the colour or entering a “1″ or “0″.The HTMLl file basically tells your Joomla web site template what to pull into view from the files on your server and where to display them.

 

How to edit your CSS file in your Joomla web site:

1) Log in to www.yoursitename.com/administrator

2) In the row of menus across the top, go to “Extensions”

3) Choose template manager in the drop down menus

4) Choose Site templates in the menu that slides out to the side

5) When the page loads, put a check mark in the box next to your default template.

6) Click “Edit” in the top right hand corner.

7) Change the parameters of your template you wish to change

8) Click “Edit CSS” in the top right hand corner.

9) Make changes to your CSS file that you wish to by select “template.css’’ and click Edit

10) Click the disk icon to save.

 

How to edit your HTML file in your Joomla web site:

1) Log in to www.yoursitename.com/administrator

2) In the row of menus across the top, go to “Extensions”

3) Choose template manager in the drop down menus

4) Choose Site templates in the menu that slides out to the side

5) When the page loads, put a check mark in the box next to your default template.

6) Click “Edit” in the top right hand corner.

7) Make changes to your HTML file that you wish to by clicking “Edit HTML” in the top right hand corner.

8) Click the disk icon to save.

 

Joomla’s hidden feature – hiding Intro Text

Joomla provides you with many options by which to display an article. However, did you know one of the most underutilised options is the fact that your article can hide its own “Intro Text”? The teaser you see in a blog layout, or a newsflash module, can be different when you actually display the full article.

Joomla Web sites typically use the “Intro Text” and the “Read more button” and just continue the story from the Front page Blog view, or a Newsflash module – but it doesn’t have to be that way. You can actually hide the Intro Text when displaying the full article.

To do this, edit the article in the Joomla Administrator.

Click on the “Parameters (Advanced)” pane to the right of the text of the article.

Find the parameter called “Intro Text” and change the select list to “Hide”. Your article might look something like the following screenshot.

(You will note that I’ve fixed up some of the typo’s since I took this shot.)

Save the article.

Now have a look at the article as it appears in a blog view, or a module, and then look at the full article.

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist. The next article will discuss about Layout Override in Joomla.

1051

Joomla! 1.5 Using Typography

This month article provides detailed instructions for using the Typography styles included in the template on your site. If you would like to see all of the Typography styles in action, check out the appropriate place on the demo site.

 

Most templates have their own set of content styles, known as Typography. Typography can come in a number of varying and diverse formats, ranging from simple text modifications to image insertions. Typography improves the look and layout of your website and gives it life. This article will take you through the necessary steps to adding typography to your Joomla! content.

 

Inserting Typography with the HTML Editor

To insert the Typography into your content, you must use the HTML feature of all Joomla! content editors. The article will outline the steps in which does this with the default Joomla! content edit, TinyMCE. Please be aware, even though there are other content editors available, all are basically the same and the steps with be just as effective if you are using another content editor.

Please note that the following article will show you how to insert HTML (typography) into Static Content, the same procedure is apparent for Content Items and Custom Modules.

 

 

 

 

 

 

 

 

    • Login to the Joomla! Administration Control Panel. Either, use the Administrator link on your mainmenu when you are logged into the Frontend of your website or use the direct web address of the Administrator Control Panel, www.yoursite.com/administrator. Enter the Administrator’s Username and password.
    • Navigate to the Article Manager. Once you have logged in, hover over the Content link on the top taskbar, scroll down to Article Manager.
    • The Article Manager

When you selected the Article Manager link, you will be sent to the Article Manager control panel. Select either Edit or New, depending on whether you want to add typography to an existing or new item.

    • The HTML icon

To add typography to your content, you must enter the HTML mode of the Content editor. In the TinyMCE 2.0 editor, this is an icon called “HTML”, in some other content editors; it is a tab but will be clearly marked for easy navigation. Push the icon to enter HTML mode.

    • The HTML Editor

A popup will appear with your content in HTML format, in the following screen shot, you will see the above screenshot’s text in HTML coding. You must do all of your editing here for typography.

    • Inserting Typography

In this case, we will be using the Info span style for the example text. You will not see the effects in the content editor; all style affects are only visible on the Frontend of your Joomla! Website.

    • The Result

The following screenshot shows you the end result of inserting the HTML code into the content.

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.

 

Special Offer

Celebrating the first Digit anniversary a free Joomla template will be offered to all our valuable readers. VDigitEco is a free Joomla template in a natural green colour variation. It is fast loading and W3C compliant. Click here to download it.

1166

Joomla! SEO Tips and Tricks

SEO (Search Engine Optimization) may sound complicated and expensive, but there are a number of things you can do to improve your search engine ranking that won’t have you spending a cent or tearing your hair out. Here the 10 SEO tips and tricks for your Joomla sites.

1) Don’t install any sample data when you set up a Joomla! site.

When you launch your Joomla! Site, it’s very easy to forget to delete all the demo articles that come with it. That will give you pages, links and newsfeeds that are irrelevant to your topic. Delete your sample data and don’t forget to empty your trash as well!

2) Your Site Name should be your site’s name.

There can be a temptation to cram as many keywords as possible into the “Site Name” field. It doesn’t help and when users register at your site, they get an email saying “Welcome to Widgets, Buy Widgets, Cheap Widgets, Bargain Widgets!” You don’t want that.

3) Turn off your PDF links.

When we analyze Joomla! Sites, we often find PDFs ranking higher than the original pages. Because PDF pages have no menu links, they’re a dead-end. Users can’t move from the PDF to the rest of your site. So turn off those links.

4) Don’t waste your site’s link juice with lots of social bookmarking links.

Let’s face it, very few pages have a chance to hit the Digg home page or do well on Reddit, so only place those buttons on your best articles. Your visitors appreciate clean, uncluttered pages — and so do search engines.

5) Redirect the www and non-www versions of your site to the same place.

All you need to do is add this little piece of code to your .htaccess file.

Note: Replace MyDomain with your domain name and .com with your domain extension.

## Can be commented out if causes errors.
Options FollowSymLinks
# mod_rewrite in useRewriteEngine On
RewriteCond %{HTTP_HOST} ^MyDomain\.com$ [NC]
RewriteRule ^(.*)$ http://www.MyDomain.com/$1 [R=301,L]
RewriteCond %{HTTP_HOST} !^.*MyDomain\.com [NC]
RewriteRule (.*) http://www.MyDomain.com/$1 [R=301,L]

6) Turn on your cache.

Search in Google and you’ll see a size for each site. Smaller, faster sites are more popular with visitors and with Google. One easy way to make your site act small and load faster is to turn on your cache in Global Configuration.

7) Enter a full description for all your sections and categories.

These pages are great for organizing your site… and for improving Page Rank. If you organize your sections and categories carefully, your site becomes very easy for both people and search-engine spiders to navigate.

8) Less is often more

Having thousands of Joomla! pages indexed in Google isn’t always a good thing, especially if those pages don’t bring value. Some components, for example, can produce lots of extra pages that are completely worthless. One easy way to check if your site is putting garbage on Google is to search for site:mydomain.com. If you find pages that don’t have good content, you might want to remove them.

9) Empty your global configuration metadata.

I’m sure you’re all big fans of Joomla! But I’m equally sure that “Joomla! – the dynamic portal engine and content management system” doesn’t describe your site. Take it out.

10) Be confident.

Joomla! is a fantastic software that allows you to easily create lots of high quality pages that are great for your SEO. If you keep a close eye on your site and take the time to learn how Joomla! Works, there’s no reason why you shouldn’t have top-flight search engine rankings!

 

Things not to introduce for your joomla web site.

Do not include hidden text within your web site. Some web masters have being known to include hidden text or targeting keyword to move up the rankings. Basically they hide the text from the real user i.e (white text on a white background) and so on. Google can spot this and will penalize your web site.

Loading pages with keywords avoid spamming the search engines by including lots of keywords which have little relevance to the content of you web site or make no sense if a real user was to visit and read the content on your web site.

Avoid Doorway pages. Do not use doorway pages i.e – individually optimization pages for specific search engines.

Avoid cloaking involves dynamically generating thousands of keyword rich web page’s using server side scripts which only the search engine Bots can see but the end user cannot. Some Webmasters have introduced this approach to gain a high ranking which may work in the short term but in the long term it will fail and your site ( domain ) will be banned or removed from the index.

Avoid automated submission web sites. You may have seen many SEO sites selling services which include submitting your Joomla web site to hundreds of search engines, FFA link farms and directories. If you do decide to use this service you could get banned for “spamming the search engines” I would strongly advise you avoid using such sites but instead manually submit your site to the relevant search engines Google, Yahoo, MSN and so on. Another approach is not to submit your site directly to the search engine but let them find you. This involves creating a linking strategy based on exchanging links with sites that are both established and have a good Page Rank. The Bot will then index the high ranking site and follow your link therefore indexing your web site.

 

So… What to do?

Create high quality keyword rich content

When writing content for your Joomla web site create it for users not search engines. Focus on creating content which is relevant to your web site i.e if you run a Joomla template site then focus on writing content for joomla templates. Also make use of your targeted keywords within the content and use H1 and H2 “bold” to highlight and reference keyword phrases. Use hyperlinks to reference the relevant web sites and also use anchor text.

Linking strategy

Think about who your target audience and web sites who have a similar interest to the service or content you are offering via your web site. Do your research, Search Google, Yahoo, MSN or visit the communities and build up a list of sites with similar interests. For example if you run a Joomla web site dedicated to Joomla open source then build up a relationship with other sites based on exchanging web links with them or news articles. Also when submitting your web link to a web site make sure the title and keywords relating to the web site are referenced in the web link, news article.

Title, description and Metatags

Joomla incorporates some very useful functionality which compliments your content to ensure the title, description and metatags are relevant to each specific document. Make sure you make use of the functionality available within Joomla.

For example once you have written your news item complete the following.

  1. Associate the news item with the relevant news category.
  2. Click on the Meta Info tab.
  3. In the description field enter a relevant, clear and concise Meta description which clearly reflects the content of the news item.
  4. In the keywords field you may need to add additional keywords.

Site Title Tag

The site Title Tag play’s one of the most important roles in achieving a high ranking web site. Search engines including Google, Yahoo, MSN and AltaVista place a lot of focus on the site title tag. From the Global configuration option via the Joomla Administrator you can change the site name, Global Site Meta Description, Global Site Meta Keywords.

Think about the following when creating your site title.

  1. Ensure the site title is specific and relevant to the content of your web site.
  2. Your site title ideally should be between 64 and 66 characters which make it Google friendly. Yahoo will accept up to 120 characters as per the W3 standards
  3. Add one or more of your targeted keywords in the site title.

Global Site Meta Description

  1. Write a brief description which clearly reflects the content of your web site
  2. The Meta description should be between 170 characters or 200 characters
  3. Include one or more of your targeted keywords which are included in your site title and keywords.

Keywords

Some Search engines do not give as much weight to the keyword metatag as the site title or site description but it is recommended that you make use of it.

  1. Avoid keyword stuffing i.e repeating your keywords.
  2. Add your one or more targeted keywords contained in your site title, site content within your Global Site Meta Keywords.
  3. Place your targeted ( most important ) keywords at the start of your Global Site Meta Keywords which give the keyword more weight.

Separate keywords with a comma and no spaces.

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.

1090

Setting up your Joomla website Menus

One of the first things you do after your Joomla installation is to configure your menus. Joomla menus are fairly straight forward to configure. Here we’ll give a small rundown of how Joomla menus work

Joomla Native Menus

Joomla comes along with a number of menus (when you install the sample data) to get you started (Top menu, Main menu, User menu). Each menu is basically is made up a list of menu items, (each with their own unique parameters), and a module which is used to display the contents of this menu. It is important to understand this relationship between each menu and its corresponding module; the module is where the menu “lives” and is used to display the menu in the template position where you want it to be displayed.

The menu modules are then assigned to template positions e.g. the top menu to the top position of your template, and the Main and User menu to the left position of your template as can be seen in the image below.

Obviously, one can apply the menu modules to whatever position is required and whatever position your template supports.
The Menu Manager (Menus > Menu Manager) is the where one can create any additional menus required. When creating a new menu, the Title name will be used as the name of the main menu module which will be used to display the menu.

Menu items

Once a new menu item has been created, you can edit the menu items in the menu. This is done by going to Menus menu and selecting the menu item .e.g Menus > Main Menu.

Here you can add / edit / delete / publish / unpublish menu items to this particular menu. Menu items can be created to articles, to the front page, to any new components, to search etc. The different kinds of menu items will not be described here.

Parent / Child menu items

Typically one would want to create a hierarchy in the menu. You can do this by creating items as children of other menu items. This is done by choosing a Parent, when creating the new menu item.

Displaying the menu

Once our module has been defined with the menu items, we now choose the position where we want to display it. To do this, we need to refer to the previous section where we explained the relationship between a menu and its module. As we explained earlier, each menu has a corresponding module which is used to display it. Therefore, we now need to go to the Modules, and set the parameters for the current menu module.
Thus go to Extensions > Module Manager. To find only the menu modules, you can select type to mod_mainmenu. This will only display the menu modules. You can now click on the menu name. e.g Main Menu and set the parameters of the module, including the position in the template where you want the menu to be displayed. You’ll have the standard module parameters on the left, such as whether to display the title of the module, whether it is enabled, and which position / order. On the right you have parameters which are specific to the menu, i.e. what style to use for the menu and a number of parameters which are specific to the current menu module. Explaining each parameter is beyond the scope of this article.
So that was a very brief intro to Joomla Native menus. If you find any of this unclear, we’d love to hear from you. We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.
The next article will discuss about SEO in Joomla.

1185

Creating a website using Joomla

In this article we hope to teach you how to manage your content in a joomla web site.

 

Creating a Section

First of all navigate to Content > Section Manager button.

You will then be displayed with a list of Sections or a blank list like this:

To create a new Section click the New button on the top right of the page.

This will display a form into which you could input the required Section data.

Fill in the name you want for your section and switch the Published box to yes.

When you’re happy with the data added, click the Save button.

 

Creating a Category

Next we will teach you how to set up a Category within a Section.

Navigate to Content > Category Manager.

You will then be displayed with a list of Categories like this:

To create a new Category click the New button on the top right of the page.

This will display a form into which you can input the required Category data.

Fill in the name you want for your section and switch the Published box to yes.

Select the Section you just created from the Drop-down menu.

When you’re happy with the data added, click the Save button.

 

Creating an Article

Next teach you how to create an Article.

Articles are the main way of displaying content using Joomla.

To create an article navigate to Content > Article Manager

You will then see a list of current articles displayed, click the New button to take you to the article creation screen.

 

You can now give your article a Title, Section and a Category. Also set an alias whether it set to the front-page or not.

 

 

Now enter the content into the text area and click the Save button.

 

Creating a Menu Item

After you’ve created an Article navigate to the Menus > Main Menu button.

You will then be displayed with a list like this:

You now need to click the New button. You will then be displayed with a menu.

Click Internal link > Articles > Article Layout.

You shall then be directed to a Menu Item creation screen.

Enter the menu button Title and click the Select article button to display a list of articles you have created.

Select the Article you want to use and click the Save button to save the menu.

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.

The next article will discuss more about Site Management in Joomla.

1251

Joomla SEO (Search Engine Optimization)

 

SEO stands for Search Engine Optimization. It is a great way to make our web “read” by the search engine. Many web owners hire SEO professional to optimize their web. But for the Joomla 1.5 users, they should be happy because of this version, Joomla had improved better features for SEO.  There are three techniques for SEO in Joomla, they are Search Engine Friendly (SEF) URLs, mod_rewrite (only for Apache), and suffix. If you want to apply SEO, you should choose at least SEF option. If you want to use mod_rewrite, SEF option must be selected. It is much better if we use suffix too. With suffix, in the end of the URL will be added .html. Available combinations for SEO in Joomla are:

 

  • SEF
  • SEF + suffix
  • SEF + mod_rewrite
  • SEF + mod_rewrite + suffix (recommended)

The difference among combinations above is the URL produced. If we don’t use SEO, the URL will be:

http://blog.digit.com/joomla15/index.php?option=com_content&view=article&id=19&Itemid=27

  1. For the SEF option, the URL will be:
  2. <pre>http://blog.digit.com/joomla15/index.php/joomla-overview

The URL can be read easily than the URL without SEF. Notice that there is “index.php” in the URL.  If we add suffix option, then in the end of the URL will be appended html extension like shown below:

ttp://blog.digit.com/joomla15/index.php/joomla-overview.html

Compare if we use Apache mod_rewrite, the result is shown below:

http://blog.digit.com/joomla15/joomla-overview

 

If we use mod_rewrite, URL will look nice and tidy without “index.php”. Html extension can be appended by choosing suffix option. The resultis shown below:

http://blog.digit.com/joomla15/joomla-overview.html

 

SEO Implementation in Joomla! 1.5

SEO Implementation in Joomla 1.5 is very easy.

  1. Login to Joomla back-end as super administrator.
  2. Choose menu Site > Global Configuration.

 

 

  • In Global Configuration there are three tabs that are Site, System dan Server. In tab Site, look at the SEO Settings. Choose the combination as you need.

 

 

  • Click Save or Apply.

Joomla! 1.5 SEO Settings

Remember

If you want to implement option number two (Use Apache mod_rewrite), the web server should be Apache and also the mod_rewrite module should keep active. After that rename htaccess.txt in the Joomla root directory to be .htaccess >
If you get error message while implementing SEO option number two, try to edit .htaccess file, find this line:

Options +FollowSymLinks

Add “#” character. So the line will be:

#Options +FollowSymLinks

Restart your Apache web server.

Rename htaccess.txt to be .htaccess in Windows

In default Joomla 1.5 installation, there is a file named htaccess.txt. This file will be used useing Joomla SEO that is option Use Apache mod_rewrite. Before it can be used, this file should be renamed to .htaccess. In Linux OS, this case is not a big problem; because it allows creation this kind of file (file name is started with “dot” character). For Windows user this case is a problem, because Windows doesn’t allow creation this kind of file. If we force it, a warning will appear like shown below:

Error while renaming htaccess.txt to .htaccess

 

In order to rename htaccess.txt to .htaccess, we could do it through command prompt. Syntax:

ren [htaccess.txt directory]\htaccess.txt .htaccess

Example:

ren DaGu\htdocs\joomla15\htaccess.txt .htaccess

That’s it!

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.

The next article will discuss more about Site Management in Joomla.

1476

Converting HTML Template to Joomla Template

Today we discuss how a HTML Template converts to Joomla Template. Converting a HTML template to a Joomla template is not as hard as you think. Only five easy steps and you can create and use your Joomla template.

Why you want to learn this? Because perhaps you stumble into beautiful free html templates while browsing on the net and really want to use it for your joomla based website.

 

Step 1

Prepare your template. The template should be (X) HTML&CSS compliant. There are lot of HTML templates on the Internet, just search them by using Google. Templates in Joomla are filed under a directory named templates. Ensure the HTML file, images and CSS file are inside one single directory created under templates folder. For example, take a look at the Joomla template structure below:

 

Joomla Template Directory Structure

Joomla will search index.php inside the template directory. So, rename the index.html file to index.php.

 

Step 2

Replace the HTML code before the body tag of your HTML file with this code.

 

<?php

 

// no direct access

defined( ‘_JEXEC’ ) or die( ‘Restricted access’ );

?>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”<?php echo $this->language; ?>” lang=”<?php echo $this->language; ?>” >

<head>

<jdoc:include type=”head” />

 

<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/system.css” type=”text/css” />

<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/system/css/general.css” type=”text/css” />

<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/your_template_name/your_css_directory/your_css_file.css” type=”text/css” />

 

</head>

You should notice at this code:

 

<link rel=”stylesheet” href=”<?php echo $this->baseurl ?>/templates/your_template_name/your_css_directory/your_css_file.css” type=”text/css” />

 

Change “your_template_name” to the name of your template, “your_css_directory” to name of your css directory, and the last, change “your_css_file.css” to the name of your css file. If you have more than one css file, you should declare them one by one.

If you have some javascript files, you should declare them with the same way.

The template contains the various files and folders that make up a Joomla template. These files must be placed in the /templates/ directory of a Joomla installation in their own folder. So if we had two templates installed, our directory would look something like the following:

 

/templates/digit
/templates/vmjoom

 

Note that the directory names for the templates must be the same as the name of the template, in this case element and vmjoom. Obviously they are case sensitive and shouldn’t contain spaces.

 

Step 3

The default Joomla template has a few module positions such as breadcrumb, left, right, top, user1, user2, user3, user4, footer, debug, and syndicate. The joomla module positions are shown below.

 

 

Joomla Module Position

To create a module position, we need to place this code <jdoc:include type=”modules” name=”your_module_position_name” /> to appropriate position. The name attribute is the module position name. The snippet code to create a module position is:

<div id=”header_r”>

<div id=”logo”></div>

<jdoc:include type=”modules” name=”top” />

</div>

 

After that, you need to place a component. The code is shown below.

 

<jdoc:include type=”component” />

 

If you need to include message, you only need to include this code:

 

<jdoc:include type=”message” />

 

Step 4

Create a manifest file. You need to create a manifest file to list all files you used. If you don’t create it, it will cause error while installing your template. Here is the sample of a manifest file:

 

<?xml version=”1.0″ encoding=”utf-8″?>

<!DOCTYPE install PUBLIC “-//Joomla! 1.5//DTD template 1.0//EN” “http://dev.joomla.org/xml/1.5/template-install.dtd”>

<install version=”1.5″ type=”template”>

<name>your_template_name</name>

<creationDate>20/07/2009</creationDate>

<author>Harsha Gomes</author>

<authorEmail>harsha@vishmitha.com</authorEmail>

<authorUrl>http://vishmitha.com</authorUrl>

<copyright></copyright>

<license>GNU/GPL</license>

<version>1.0.0</version>

<description>template description goes here</description>

<files>

<filename>index.php</filename>

<filename>templateDetails.xml</filename>

<filename>template_thumbnail.png</filename>

<filename>images/arrow.png</filename>

<filename>images/logo.png</filename>

<filename>css/template.css</filename>

</files>

<positions>

<position>breadcrumb</position>

<position>left</position>

<position>right</position>

<position>top</position>

<position>user1</position>

<position>user2</position>

<position>user3</position>

<position>user4</position>

<position>footer</position>

<position>debug</position>

<position>syndicate</position>

</positions>

</install>

 

Don’t forget to enlist all your files used in your newly made template inside files tag. If you missed, the files won’t be copied to Joomla template directory during installation process. Positions tag is used to declare the position name used in your template.

 

Step 5

Package it. You may create a thumbnail of your template before packing it. It should have 206px width and 150px height. And finally compress your template to a zip file and your template is ready to go. Don’t forget to test it before sharing it to the Internet in case you feel like it.

We highly appreciate your valuable comments after reading this article. Also, if you have any issues in joomla you could email to harsha@vishmitha.com or Supporting Forum to get our assist.

The next article will discuss about Site Management in Joomla.