Web 2.

0 Development With Drupal

By:- Siddhant Satija

CEO RitSan Media Ventures Pvt. Ltd. Founder projectagya.com

__________________________________

RitSan Media Ventures Pvt. Ltd.

E3 block , 1st floor , Amity Innovation Incubator , Amity University ,Sec 125, Noida .

www.ritsantech.com www.projectagya.com Contact:- [email protected] www.facebook.com/s.satija

1|Page

Front Page View And Block Placement

Getting Your Blogs Posts Onto The Front Page
Set up a view (which is basically a list) for your blog posts and make that view the front page of your site. Its true that there are simpler ways to do this, namely clicking the Promoted to front page checkbox in the add content window, but Views is so integral to Drupal that I think you should get started using it sooner rather than later. To get started click on the Structure link in the admin menu, then select the Views link which should be the last one in the Structure window. At the very top of the next window you will see an Add new view link. When you click that link you should see a window that looks like the image below.

There are a lot of choices to make when adding a new view so Ill make it easy for you and show you the choices I have made in the image below.

2|Page

Youre free to change any of the details to suit your own needs. The most important thing to understand is that these choices will result in the following features. 1.A list of blog posts with the newest blog post displayed at the top 2.A dedicated page at yourblog.com/blog that shows ten teaser (or summary) posts that include the title, the beginning of the body field and a link to the full post 3.A dedicated RSS feed that people can use to subscribe to the blog in an RSS reader 4.A block that you can place in the sidebar that has links to the five most recent posts Once you have filled in your choices click the Save and exit button to complete the creation of your feed. The screen will refresh and youll be looking at the new page you created at yourblog.com/blog. You should see the Hello World post you created and an orange RSS feed icon that links to the blog feed. Now that the view for your blog has been created the next thing you want to do is make that view the front page of your site. Click on Configuration in the admin menu then select the Site information link. The second section from the top of the site information page is called Front Page. Change the Default front page field from node to blog or whatever path you gave to your blog post view. Click Save configuration then navigate to your site home page. The front page of your site should now look something like the image below. 3|Page

Besides your blog posts the blocks to the left side of your posts are another important element of your site. The block you see on the top is the standard search block. Ill have you leave that in place. The next blog down is the navigation block which we really dont need since we have the administration bars at the top of the page. In the next section I will show you how to remove that block and add other blocks that you do need.

4|Page

Arranging Sidebar Blocks

Click on Structure in the admin menu and then select the Blocks link which is the first link. You will see a table that looks like the one in the image below. Focus on the Sidebar first section of the table.

Click on the list box in the Navigation row and set the value to -None-. Youll notice that Navigation disappears from the row. Scroll down to the very bottom of the page and drag the row called blog_posts: Block to the space below the Search form field. Then navigate to the bottom of the page and click the Save blocks button. Navigate to the home page and you will now see the Recent Posts block below the Search block. If you like you can also add a Recent Comments block to the sidebar. The Drupal core comments module has created this block for you. Just go to the block administration window and drag Recent Comments to the appropriate position or select Sidebar first from the list box in the Recent Comments row. Keep in mind that those changes are not saved until you select the Save blocks button. The final block that Ill have you place for now is the block that will hold your tag (or category) cloud. In the Block administration window look for Tags in Tags and move that to Sidebar first then save your blocks. If you go to the home page it should now look something like the image below.

5|Page

Youll notice that the Tags in Tags block has a dotted line around it with a configuration icon in the upper right portion of the block. The ability to go to the edit views of blocks directly from the block itself is a nifty new feature in Drupal 7. You should see something like that when you put your cursor directly over the block and point to the configuration icon. For all blocks you have the option of editing the title, the access levels and even the pages that they appear on. Tags in Tags happens to be a block that has an additional configuration option. You can edit the number of tags that appear in the block. If you click on the configure block link that appears when you mouse over the configuration icon you will be taken to the block edit window where, among other things, you can adjust the block title to something like Topics and also change the number of tags that will be displayed if you like. Remember to click the Save button at the bottom of the window. Once you do that you will be returned to the home page of your site. One thing you may have noticed when looking at your block configuration is the fact that the User login block is placed in the Sidebar first section. If you dont want anonymous users to see that blog you should remove it just like you removed the Navigation block. You can always reach the login page of your site by navigating to /user/login.

6|Page

Create A Shortcut To Add Blog Posts

Now is a good time to help make things easier for you. You probably noticed that it took several clicks to get to the Create Blog Post window. Thats way too many clicks in my opinion. Thankfully Drupal 7 has a customizable shortcut bar below the administration menu. Youll notice that it already has links for Add content and Find content. Click the plus sign (+) to the right of the Create Blog Post page title. Refresh the page and you should now see a Blog Post shortcut added as in the image below. Now you can start to create a new post with just one click.

Blog Post Shortcut

Setting Up Category Tags

Category tags allow you to freely categorize your content by typing words in a field on content editing screen. Well use the tags to create a tag cloud that your visitors can click on to go directly to the topics that interest them most. This feature is enabled via the combination of the core Taxonomy module and the contributed Tagadelic module which we added in the previous section. Click on Structure in the admin menu and then click the Taxonomy link. The next screen you see will have an Add vocabulary link at the top of the page. Click that link and give it the name Tags and the description Blog post topics. Then click the Save button. Youll be returned to the taxonomy window but now you will see your new vocabulary listed as shown in the image below.

Now that you have created your vocabulary for your blog topics you need to add the vocabulary field to the Blog Post content type so that the field will appear when you are editing content. Click on the Structure link in the admin menu and then click the Content Types link. You should see something that looks like the image below.

7|Page

In the row that says Blog Posts click on the manage fields link. In the resulting window add a new field by filling out the empty fields as in the image below.

Once you have filled in the fields click the Save button. The next window you will see allows you to set up the tagging field. There are just a few things you need to do in this window. 1. Check the Required field check box; 2. Add Help text to describe the field if you like;

8|Page

3. Click the Save settings button. Once you have completed those steps you will be returned to the Blog Post Fields window. Youll notice that the Tags field is at the bottom of the list of fields. Thats where the field will show up in the editing window as well. I like to have the Tags field above the body field so I recommend that you click and drag the field using the cross (+) sign on the far left of the Tags field. The image below shows you what the window should look like after you drag the field.

Click the Save button to finish this task. Congratulations, you have completed setting up your category tags. If you click the Add content link in the shortcut bar (below the admin bar) then click the Blog Post link you should see a window that looks like the image below.

9|Page

Notice how the Tags field is above the Body field in the position where we dragged it to when setting up the field. Also notice the red asterisks (*) that indicate the field is required.

Adding Additional Authors

At some point you may want to add someone other than yourself as an author on your blog. Adding new authors is simple but it does require that you understand a little bit about roles and permissions in Drupal. First Ill show you how to set up a new role just for your added authors and then Ill show you how to add the new user account. Select the People in the admin menu then click the Permissions tab. On the Permissions window you will see a Roles link in the upper right portion of the window. Click on the Roles link. Add a new role by entering the role name (Im calling mine author) in the blank text field at the bottom of the Name column and click the Add role button. You should receive a confirmation like the one in the image below.

10 | P a g e

Take note of the fact that you can drag your new role name in order to change the left-to-right order when you are viewing the roles in the global permissions window. The next step you need to take is to give the role the appropriate permissions. To do that click on the permissions link in the upper right portion of the window. That will take you back to the global permissions view that includes all of the other roles. I use this window to change permissions for a role because I find it easier to review a particular role in relation to other roles. When you look at the author column you will notice that a number of the permissions have been checked and grayed out. Those permissions have been inherited from the Anonymous (or not logged in) User and the Authenticated User roles. I could have made things easier by having you edit the Authenticated User role to add post authoring capabilities, but creating a separate role for authors is a better practice because you may want to use that authenticated role to use to allow commenters to register on your site. What you want to do now is check off the appropriate permissions for your author and click the Save permissions button. So what are the appropriate permissions? In the end that is really up to you but Im going to offer my suggestions in table below as a starting point.

11 | P a g e

Administering Your Drupal Site Backing Up Your Site

Frequent backups of your site are a good idea. Backups will allow you to recover the site to a certain state in the unlikely event that something goes wrong. There are two major elements of a Drupal site backup: the files, and the database. Backing up your files is as easy as copying them from your server and downloading them to your local machine. If you have a particularly large site that has many uploaded files this could take a while depending on the speed of your internet connection. Copying your site files every so often is an important task though so consider it time well spent. There are different ways to make a copy of your database. More experienced users can use phpMyAdmin to take an export of the tables from the Drupal site. If you know and have used phpMyAdmin before you probably dont need my guidance on exporting the database. There is a good post on Drupal.org called Exporting a database with PHPMyAdmin that you can use as a step-by-step guide as well (http://drupal.org/node/81993 ) You also have the option of using a module. If you would like to do that then I recommend the Backup and Migrate module. Backup and migrate settings can be found in the System group of the Configuration window. The module offers options for backing up the current database and restoring earlier versions of the database. You can back up the database to your web server or your local machine. If you want to back up to your server you must specify a private file system path in the file system settings window. For the moment Im going to walk you through the process for downloading a copy of your database. When you go to the backup and migrate settings you will have the option to take an immediate backup using the default settings as shown in the image below.

If you click the Backup now button with the settings in the image above a dialog window will pop up that prompts you to save a .mysql file to your hard drive. You can customize the options, such as the file name and compression by clicking on the Advanced Backup link. If your database is large you may want to apply compression in order to save space and prevent potential problems with upload limits when restoring the backup. In the event that you need to restore the database to a previous version you can do so by clicking on the Restore tab. The process of restoring the database involves uploading one of the saved database exports from your hard drive. You can also set a schedule for automatic

12 | P a g e

database exports by clicking on the Schedules tab. The scheduling of database backups relies on cron which I will cover in the next section.

Running Cron
If you are familiar with Drupal from an earlier version you are probably familiar with cron. Cron triggers many important periodic tasks such as checking for module updates, updating the search index and running periodic tasks for other modules. You can run cron in one of three ways. 1. Click on the direct cron link 2. Configure the site to trigger cron via settings 3. From an external program or script The direct cron link can be found at the location of your site status report which can be accessed via the Reports link in the admin menu. A section called Cron maintenance tasks can be found near the top of the status report. That report will tell you when cron was last run. That section includes a link to run cron manually and also includes a tokenized link that you can use to run cron from outside scripts or programs. The key in the link is new to Drupal 7 and it prevents an outside program from running cron without your permission.

Cron Status Report

The Status Report

In the previous section I mentioned the status report. The status report offers a quick overview of the situation with your Drupal website. Each line of the report is color coded to indicate how things are going with the site. Green shading means a particular item is okay. Yellow shading means you have something to look into. Red shading means that something needs to be fixed right away. One very important bit of information on the status report is the Drupal core update status. That indicator lets you know if there are available updates to Drupal core. If a check hasnt occurred in a while then the row turns yellow as in the image below.

13 | P a g e

Core Update Status

A little further down in the status report is the Module and theme update status indicator. That bit of information lets you know if there are updates available.

Module and Theme Update Status

In both cases if updates are required then links are included to click through and see which updates are available. You can also see the status of core, modules and themes by clicking on the Available updates link in the Reports window. Chances are that you will find it helpful to be notified via email when an update is either available or required. If you click the Settings tab in the Available updates window you will find update notification options. In the next section Ill give you some information on how to make the actual updates.

Module, Theme And Core Upgrades

Modules and themes are easy to update in Drupal 7. When viewing the Available updates window click on the Update tab to open the window that will allow you to install the updates. As in the image below you will see which items have updates available and will find links to install, download or view release notes

Automated and Manual Updates

14 | P a g e

Contributed modules and themes can be installed automatically by selecting the box net to the name and clicking Download these updates. When the updates are complete you will be prompted to continue with the site in maintenance mode. Maintenance mode. takes your site offline temporarily why new code is being installed. You will then be prompted to make updates to run database updates. Continue until Drupal indicates that database updates are complete. If necessary, remove the site from maintenance mode by clicking the Go online link in the maintenance mode system message. Its important to note that you can put the site into maintenance mode any time by selecting the Maintenance mode link in the Development group of the Configuration window. Once there you can select a check box to toggle the maintenance status. You can also customize the message that is displayed to visitors when they come to your site while it is in maintenance mode. Drupal core updates must still be done manually. Take the following steps to perform a manual update. 1. Download and unzip the new Drupal release. 2. Put your site into maintenance mode. 3. Backup your sites directory and Drupal database.4 4. Delete all the files and folders except the sites directory. 5. Upload the new Drupal release files to the root of your website. 6. Navigate to /update.php and follow the prompts. 7. Review the feedback to ensure the updates completed. 8. Return to the administration pages and put the site back online.

15 | P a g e

Creating Your Contact Form

Some form of general feedback is a key element to any website. For your site Im going to show you how to create a form using Drupals contributed Webform module. Webform gives you the ability to create a form with results that are both emailed to you and saved in the Drupal database. As far as Im concerned the most important consideration when creating a contact form should be how to protect that form from unwanted spam. The anti-spam solution I will show you involves pairing Webform with the Mollom anti-spam module and service. The first thing you need to do is create a new webform. Select Add content in the shortcut menu and then click the Webform link. The window you see will look just like a page content window. Add your title, Contact and short description in the body field like, Use this form to contact us. Just like you did when creating your about page create a menu link by selecting the Provide a menu link checkbox and filling out the fields in the Menu settings tab. If you set the Weight of the menu to 2 it will appear after the about page in the menu tab. When creating this webform you also need to pay attention to some of the other tabs. In the Comment settings tab select the Closed radio button. In the Publishing options tab uncheck the Promoted to the front page check box. When youre finished completing those fields click the Save button. You will see a window that looks like the one below. This is the window that you use to add individual fields that your site visitor will fill in on the form.

Add your components one at a time, clicking add after you have added a Name, Type, and considered whether or not the field is Mandatory. The following image offers guidelines on the fields to add to your contact form.

16 | P a g e

After clicking the Add button for each field you will be presented with a window that allows you to fine tune the settings for each field. For now the one field to pay attention to in that window is the Description field. The description will appear below the field to give the visitor a little information about the purpose of that field. The next step you need to take is to configure the email address that the form will be sent to after submission by the site visitor. Click on the E-mails link to the right of Form components. Enter the email you want to have email sent to on the Address field then click the Add button. At that point you will be directed to a window (see image below) that allows you to customize the look of the email sent by your Drupal site.

17 | P a g e

While the rest of the default settings are fine to begin with I recommend that you make some changes to the E-Mail Header Details. Specifically you can set the various details to display the components (Subject, Your Email Address and Your Name) directly from the form itself. You do that by selecting the Component radio button for each field and then selecting the appropriate form component from the list box. Once you have done that click the Save e-mail settings button at the bottom of the page. The final step in configuring your webform involves the remaining form settings. Click the Form settings link (to the right of E-mails) to reveal the proper window. The first thing you should do is add a custom Confirmation message. Something like the following message is fine, Thanks you for submitting your message to my blog. If necessary I will contact you within 48 hours. The next section below form settings allows you to set a custom redirection location if you wish. The next section allows you to set a Submission limit for the form. Below that is the Status of this form section which allows you to make the form available (open or closed) or not. Since this will be the site-wide contact form you will leave it open. Finally, Submission Access allows you to fine tune the roles that have permission to submit the form. Make sure that anonymous user is checked. That setting will allow any visitor to your site to submit the form. When youre done click the Save configuration button.

18 | P a g e

If you navigate to your form (there will now be a link in the menu tab) the form should look very similar to the one in the image below.

Take note of the guidelines below the Your Email Address, Subject and Message fields. Remember that those were populated via the Description field in the component configuration window. Youll also notice the submitted by field at the very top of the form. You can remove that field via the Webform content type edit window. Select Structure from the admin menu then Content Types and finally select the edit link next to the Webform content type. Click the Display settings tab (see image below) then uncheck the box next to Display author and date information, and click the Save content type button.

19 | P a g e

When you return to your contact form page the author and date information will no longer be present on the form. Congratulations on adding your blog contact form!

Preventing Contact Form Spam

Before you can start using the contact form on a live website you need to add some spam protection. Im recommending that you utilize the Mollom module which requires that you connect to the free Mollom web-based anti-spam service. If you sign up at http://mollom.com they will issue you one public and one private API key for your site. Once you have signed up for Mollom you should then go to the Mollom settings on your site to enter your keys. Click Configuration in the admin menu and select Mollom which is in the Content Authoring section. You will see a warning with a link to the Mollom settings page. Click through to the settings page. Once there enter your public and private keys then click Save configuration. Then go back to the Mollom configuration window and click the Add form link. In the next window you want to select Webform: Contact form from the list box then click Next. The next window has a few more settings to consider and theyre shown in the image below.

20 | P a g e

Mollom Configuration

The Protection mode settings determine whether the text should be analyzed or a CAPTCHA should be presented. If Text analysis is chosen the user will only see a CAPTCHA if Mollom believes that their post may be spam. Otherwise users will always see a CAPTCHA. The Analyze text for section lets you check for spam and/or profanity. Finally, the Text fields to analyze section lets you choose which fields to analyze for potential spam or profanity. When youre finished with the settings click the Save button. Since youre already working with Mollom now is a good time to add protection for the comment form on your blog posts. You can do that by once again clicking the Add form link on the Mollom configuration page but this time select Comment: Blog Post comment form. Its important to note that you have the option of turning off Mollom analysis for certain users on your site. You can fine tune the appropriate settings via the Mollom permissions which can be found in the site-wide permissions window. You get to that window by clicking on People in the admin menu and then selecting the Permissions tab on the upper right corner of the screen. If you scroll down to the Mollom section youll see something that looks like the image below.

If you want authenticated (aka logged in) users to be able to submit forms without Mollom analysis or CAPTCHAs check the box in the Authenticated User column in the Bypass Mollom protection on forms row. Scroll to the bottom and click the Save permissions button in order to save the changes.

21 | P a g e

Understanding

Google Analytics is a free service that enables you to easily track traffic to your website. All you have to do is to place a small piece of code in the header or footer of the site and then tie it up with the analytics account and this will then automatically track lots of different factors. There are other analytics providers out there, however, I have personally always used Google, as I feel that for the types of services which the websites that I own offer this will probably not do my sites ranking any harm if the analytics are provided by Google.

So, once you have set the service up, which as with all these things is not as simple as it could be, what does Google Analytics provide you with? Well lots and lots of well presented and easy to use information. When you initially sign in you are taken to your dashboard, which provides you with an overview of your month to date stats, based upon a rolling 30 days. It tells you how many visits you have had, how many page views, how many pages per visit, average time on the site, the number of new visits and the bounce rate of the visitors, i.e. how many of the visitors after landing on the home page, then went into another page on the web site.
22 | P a g e

 You can see the traffic sources, and where on the website the visitors went. Personally within Google Analytics I only really use certain areas, there is much more to it than this, but I'm only interested in certain factors. It is probably sensible to conduct a monthly review on your analytics to discuss where the traffic is coming from and how you can make changes to increase the traffic which you are receiving. So, what do I look at? Number of visitors is obviously a key area. You need to identify any trends that are developing. Normally as you publish new content you will expect to see an increase in the number of visitors to the site, as this content will appear as relevant within search engines.

I then also look at Traffic sources, i.e. where the traffic is actually coming from. This then provides a good indication of which of the methods which I am adopting is actually working for me. So if it is social media that is generating the traffic, i.e. through Facebook or Twitter, I will focus my attention on these areas and this will, over a period of time provide. I always like to see from my search engine traffic, which of the search terms is generating the traffic, as obviously if a particular area seems to be doing well, then I would continue to focus my attention on to it. Also the keywords tool is extremely useful to see which keywords I am receiving traffic for.

Obviously if you are developing a website and are spending lots of time on it, you need to make sure that you discount your own visits, before getting too excited about the traffic levels which you are generating. You can also use Google Analytics to set goals for the website or service, which you can then use to set
23 | P a g e

targets and milestones. This is a good way to measure how successful a site or service is. In my opinion, as Google Analytics is free, you should be using it, if you are not sign up today and get it installed, for me it is an important part of understand how my website is developing.

Drupal SEO CHEAT SHEET

SEO URLs
path (Drupal 7.x, 6.x, 5.x) A core module that lets to manually specify human-friendly and search engine-friendly urls. pathauto (Drupal 7.x, 6.x, 5.x) Automatically generates url path aliases that are human-friendly and search engine-friendly. path redirect (Drupal 7.x, 6.x, 5.x) Redirect from one path to another path or an external URL, using any HTTP redirect status. global redirect (Drupal 6.x, 5.x) Eliminates duplicate content that is harmful to your pagerank by properly redirecting alias urls. also fixes trailing slashes. pathologic (Drupal 6.x) An input filter which can correct paths in links and images in your content in situations which would otherwise cause them to break. search 404 (Drupal 7.x, 6.x, 5.x) When an URL generates a 404 file cannot be found error, this module performs a search on the keywords in the URL and displays the search results.

SEO Page Titles

page title (Drupal 6.x, 5.x) Gives granular control over the page title. specify token patterns for how the title should be structured. Specify custom page title that is different from node title.

SEO Meta Tags

nodewords (Drupal 6.x, 5.x) Set meta tags for each node, view, or panels page. meta tags by nodetype (Drupal 6.x, 5.x) Extends the functionality of nodewords so that meta tags can be specified on a per node type basis. meta tags by path (Drupal 6.x, 5.x)

24 | P a g e

Extends the functionality of nodewords so that meta tags can be specified on a per path basis by using user-defined rules.

SEO Menu & Breadcrumbs

custom breadcrumbs (Drupal 6.x, 5.x) Displays keyword-rich anchor tags on your site that are both search engine friendly and user friendly. menu attributes (Drupal 6.x) Specify additional attributes for menu items such as id, name, class, style, and rel. Useful for sculpting pagerank flow through your site with rel="nofollow".

SEO Social Networking

service links (Drupal 6.x, 5.x) Easily adds links to a number of social networking sites for your nodes. this will help promote your pages and get valuable backlinks to increase your pagerank potential. digg this (Drupal 6.x, 5.x) Adds a Digg this button to your nodes. Useful to increase the popularity of your pages and boost your pagerank potential. tweet (Drupal 6.x, 5.x) Provides links for your visitors to post urls to twitter. Useful to increase the popularity of your pages and improve your pagerank potential. twitter (Drupal 6.x, 5.x) Associate users with their twitter accounts. post tweets anytime new content is created on your site. Promotes your sites and increases your pagerank potential. ping.fm (Drupal 6.x) Integration with Ping.fm which makes sharing posts on other social networks easy. Helps the popularity and pagerank potential of your site. add to any (Drupal 6.x, 5.x) Helps readers share, save, bookmark, and email your pages to social networking sites. Improves the popularity and pagerank potential of your site.

SEO sitemap.xml & robots.txt

xml sitemap (Drupal 7.x, 6.x, 5.x) Creates a sitemap.xml file that conforms to the sitemaps.org specification. Helps search engines to intelligently crawl your website. robotstxt (Drupal 7.x, 6.x, 5.x) Edit robots.txt from the Drupal admin ui, generates the robots.txt file dynamically, multi-site compatible.

SEO Analysis
google analytics (Drupal 7.x, 6.x, 5.x) Integrates google analytics web statistics with your website.

SEO Compliance
seo friend (Drupal 6.x)

25 | P a g e

Compliments existing SEO compliance modules and provides several reports to show recommended meta tag and title changes. seo checklist (Drupal 6.x, 5.x) It provides a checklist that helps you keep track of what needs to be done. seo checker (Drupal 7.x, 6.x) Checks node content on search engine optimization upon its creation or modification

26 | P a g e