Kleinermann Webdesign

Tag: Tutorial

How to add or remove a www subdomain for Prestashop

Posted on by steve

Prestashop change url settingsLog into your admin interface, click on the Preferences tab, and on the SEO & URLs link one row below.

Scroll down to the area called URLs Setup, and look for the Shop domain name input field.

Here you can change the url to either use www (example: www.mydomain.com) or not (example:mydomain.com)

Now save your settings.

In order to make this work you need to let the server know about the change by updating the .htaccess file. This is done conveniently from within the Prestashop admin interface.

Prestashop generate .htaccess fileGo to the Tools tab and click on the Generators link one row below.

Then click the Generate .htaccess file button (If you can’t generate the .htaccess file from here, you will most likely be asked to change the write permissions for the file. You can do so for example via FTP).

Done.

Now you can go back to your shopfront and see if the changes took place.

Improve your Drupal theme markup with body classes

Posted on by steve

Since Drupal 6, a lot of the detailed markup as found in the excellent Zen theme framework has made its way into the default Drupal markup. More details about this feature can be found here https://drupal.org/node/163723

To use this feature for your theme just insert the variable 

 
$body_classes

into your tpl files body opening tag

like this

The result will be something like this

How to create and use a Drupal template (tpl) file

Posted on by steve

Template files are used to overwrite the core Drupal output (or the output of a module that overwrites the core Drupal output).

This can be for example useful if the layout of a particular content type, page, block or view can’t be easily fixed by a stylesheet. With a tpl file you can completely overwrite all output by using HTML/ CSS/ PHP/ Javascript/ …

This can be done by placing tpl.php files inside the theme folder. The naming of the files needs to follow a hierarchy in order for Drupal to pick up exactly which file you’d like to overwrite.

The hierarchy structure is as follows (top overwrites bottom):

For pages:
page-node-edit.tpl.php
page-node-1.tpl.php
page-node.tpl.php
page.tpl.php

For nodes:
node-type.tpl.php
node.tpl.php

For comments:
comment.tpl.php

For blocks:
block-module-delta.tpl.php
block-module.tpl.php
block-region.tpl.php
block.tpl.php

For boxes:
box.tpl.php

Taxonomy:
page-vocabularyname-termname1-termname2.tpl.php
page-vocabularyname-termname1.tpl.php
page-vocabularyname.tpl.php

Some popular examples:
page-front.tpl.php (home page)
page-admin.tpl.php
page-login.tpl.php
search-theme-form.tpl.php (search form)
search-result.tpl.php (search result)

Often a good start after you have created the new file is to copy and paste the content of the template you want to overwrite into your new template. Template files can be found in the following locations:

Drupal core themes: themes
Drupal core modules: modules
Modules: sites/all/modules
Themes: sites/all/themes

For more information see the Drupal.org website: https://drupal.org/theme-guide/6-7

Add a custom menu in Drupal 6

Posted on by steve

Basic Menu

There are three default menus available in a fresh Drupal installation.

  • Primary links – Often used to present the main sections of the website, for example as tabs along the top
  • Secondary links – Often used for pages like legal notices and contact details along the bottom
  • Navigation – Often only visible for authenticated users, showing personalised links

These can be renamed, restructured and redesigned. For details on how to set up the basic menu structure of your Drupal website please see here: https://drupal.org/documentation/modules/menu

Custom Menu

In order to add a custom menu to your theme there are three steps to complete:

  • Create a new menu
  • Add the new menu to the theme’s template.php file
  • Call for the menu

All three steps are described in detail below.

Create a new menu:

Go to the administer page https://www.yoursite.com/admin and click on the menu link

Then click on the “Add menu” link

Give you new menu a machine-readable name, in my example it will be “custom”. You can choose your own. But remember the name for later. When you are finished, click save.

Now you can add some items to the list. If you don’t know how to do this, refer to the instructions here: https://drupal.org/documentation/modules/menu

Add the new menu to the theme’s template.php file
Find the template.php file within your theme folder (Themes are located in sites ‘/all/themes/’, in case there is no template file just create an empty file called template.php and place it in your themes root folder ‘sites/all/themes/yourtheme’).

Add the following lines below the last line in the document:
  • Replace “yourtheme” with the name of your theme (the name of your theme can be found here: https://www.yoursite.com/admin/build/themes).
  • Replace the two appearances of “custom” with the name of your menu

Call for the menu

Now, after we have created the theme in Drupal, and registered it in the theme, we have to let Drupal know where we want to show the menu on the website. This can be done by placing the following code snipped in a .tpl (example: node.tpl.php) file in your theme:

Now the menu shows up in the location you have chosen. If not, check if the names of your theme and your menu are correct (case sensitive). If it still doesn’t work, you may need to customise the code a little depending on your theme. See your themes documentation for more details or contact the theme developer. Or if you like, drop me a line below.

How To Put A Facebook Like Box On My Website

Posted on by steve

What can i do with the Facebook Like Box?

Given that you have previously set up a Facebook page to promote your business or project through Facebook, you can now show everybody how popular it is by connecting your website with your Facebook page. This is done by placing a box with people that like your Facebook page on your website.

How to place a Facebook Like Box on my website?

That’s very easy! The first thing you need to do is to go to the plugins section on the Facebook Developers pages: https://developers.facebook.com/docs/plugins/

There are currently a number of different plugins available, including “Like Button”, “Activity feed”, “Registration”, etc. You might find some of them being worth a closer look. But what we are looking for now is the “Like Box” plugin:https://developers.facebook.com/docs/reference/plugins/like-box/

You can change some settings like the width of the box or whether to show a header or not, and then click the button “Get Code”. Just copy the iframe code (you don’t need the XFBML code in most cases).

The code looks like something like this:

Now you need to paste this code wherever you’d like the box to appear on your website.

Here are some common examples:

WordPress And The Facebook Like Box
Go to the backend area and click on the “Appearance” button in the left hand menu. Then select “Widgets”. Here you need to drag a new “Text” widget into the area on the right hand side were you’d like the box to appear.

The description of the areas varies, depeding on the theme you’re using for your WordPress blog/ website. But commonly this would be either the First or Second Sidebar, Left or Right Sidebar, Primary or Secondary. Then paste the iframe code in the text widget and save. That’s it.

Drual And The Facebook Like Box
Go to the backend area and find the “Administer” page, usually accessible via a menu in the sidebar. On the administer page you need to look for the “Block” link. If you can’t find it this way, look around a little or ask the website administrator. Drupal websites can vary in structure and design.

On the “Block” page, find and click the “Add Block” button. Here you need to give the block a title, insert the iframe code into the block body and choose “Full HTML” from the input formats list below the block body. Then scroll to the bottom of the page and save.

Now the new block appears in the “Disabled” section of the list. You need to place the new block in the region you would the Facebook Page Box to appear, usually this would be one of the sidebars.

Save and done.

General HTML Website
If you have a simple html website, just paste the code in your html file in the appropriate location, which will be somewhere between the opening < body > tag and the closing < /body > tag.

Customising The Facebook Like Box
To change the look of the box you can change the following attributes within the iframe code:

href – the URL of the Facebook Page for this Like Box
width – the width of the plugin in pixels. Default width: 300px.
height – the height of the plugin in pixels. The default height varies based on number of faces to display, and whether the stream is displayed. With the stream displayed, and 10 faces the default height is 556px. With no faces, and no stream the default height is 63px.
colorscheme – the color scheme for the plugin. Options: ‘light’, ‘dark’
show_faces – specifies whether or not to display profile photos in the plugin. Default value: true.
stream – specifies whether to display a stream of the latest posts from the Page’s wall
header – specifies whether to display the Facebook header at the top of the plugin.





If you have any questions or suggestions regarding this tutorial please leave me a comment 🙂

x


Request a quote

I will get back to you within 24 hours.