Search icon CANCEL
Subscription
0
Cart icon
Your Cart (0 item)
Close icon
You have no products in your basket yet
Save more on your purchases! discount-offer-chevron-icon
Savings automatically calculated. No voucher code required.
Arrow left icon
All Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Newsletter Hub
Free Learning
Arrow right icon
timer SALE ENDS IN
0 Days
:
00 Hours
:
00 Minutes
:
00 Seconds

How-To Tutorials - CMS & E-Commerce

830 Articles
article-image-simple-alphabetical-glossary-using-jquery
Packt
05 Oct 2009
8 min read
Save for later

Simple Alphabetical Glossary Using jQuery

Packt
05 Oct 2009
8 min read
Adding jQuery to your page As we have discussed above you can download the latest version of jQuery from jQuery site (http://jquery.com/) and can be added as a reference to your web pages accordingly. You can reference a local copy of jQuery using <script> tag in the page. Either you can reference your local copy or you can directly reference remote copy from jQuery.com or Google Ajax API (http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js) Prerequisite Knowledge In order to understand the code, one should have the basic knowledge of HTML, CSS, JavaScript and basic knowledge of jQuery. Ingredients Used HTML CSS jQuery Photoshop (Used for Designing the Button Background) Preview/Download If you would like to see the working example, click the following link: http://www.developersnippets.com/snippets/jquery/alphabetical_glossary/alphabetical_glossary.html. And if you would like to download the snippet, click the following link: http://www.developersnippets.com/snippets/jquery/alphabetical_glossary.zip. Figure 1: Snapshot of "Simple Alphabetical Glossary using jQuery" Figure 2: Overview of div’s and Listings used Figure 3: Image used for Listings (CSS Sprite) Successfully tested The above application is successfully tested on various browsers like IE 6.0, IE 7, IE 8, Mozilla Firefox (Latest Version), Google Chrome and Safari Browser (4.0.2) respectively. HTML Code Below is the HTML code with comments for you to better understand. <div id="body-container"> <div class="glossary-container"> <ul class="firstUL"> <li id="a" class="selected">A</li> <li id="b">B</li> <li id="c">C</li> <li id="d">D</li> <li id="e">E</li> <li id="f">F</li> <li id="g">G</li> <li id="h">H</li> </ul> </div> <!-- Close of glossary-container --> <div class="content-container"> <!-- A --> <div id="content-for-a" style="background-color:#d2e2fc"> <!-- Content for A --> </div> <!-- B --> <div id="content-for-b"> <!-- Content for B --> </div> <!-- C --> <div id="content-for-c"> <!-- Content for C --> </div> <!-- D --> <div id="content-for-d"> <!-- Content for D --> </div> </div> <!-- Close of content-container --></div> <!-- Close of body-container --> Explanation of HTML Code To get the UI shown in above screenshot, I have written some HTML div tags to hold the Glossary terms in one container and the results in another container. CSS styles are used to assign some nice colors. <div id="body-container">.....</div> I have used "body-container" as the main container to catch hold of other two div containers. <div class="glossary-container">.....</div> "glossary-container" contains a glossary term that is Alphabets, as of now in this example I have used alphabets only from "A" to "H". <div class="content-container">.....</div> In "content-container" I have arranged all the results or definitions of glossary terms, for each and every glossary term I have used separate <div> tags like for Alphabet "A" --- <div id="content-for-a" style="background-color:#d2e2fc">....</div>, and given default background color as "background-color:#d2e2fc" which highlights the definition accordingly. After going through the HTML code, we will have a glance on CSS styling. This is very important to give a good look and feel to the application. Explanation of CSS Code <style>/* Making margin and padding to 0, since by default the body will be allocated some amount of pixels of margin and padding. */body{ margin:0; padding:0;}#body-container{ width:415px; /* Given a constant width of 415px to body-container div */ height:500px; /* Given a constant height of 500px to the div */ margin:0 auto; /* This will align the div to center */ border:1px solid #3285ef; /* Giving the border */}#body-container .glossary-container{ clear:both; /* This will not allow floating elements on either sides */}#body-container .content-container{ height:430px; /* Given a constant height of 430px to the div */ width:415px; /* Given a constant width of 415px to the div */ overflow:auto; /* Scroll bar is shown when content is more than specified height */ font-family:'Arial',Verdana,Tahoma; /* Taken the default font to 'Arial' */ font-size:10pt; /* Making font size to 10 points */ clear:both; /* This will not allow floating elements on either sides */}#body-container .content-container div{ padding-left:10px; /* Left padding given as 10px */ border-bottom:1px #666666 solid; /* In order to separate each terms given bottom border color as #666666 (gray) with 1px */}#body-container .content-container div h2{ margin-top:0px; /* Making the top margin to 0px */}#body-container .content-container p.return-to-top{ color:#0066FF; /* Giving text color to Return to top text */ text-decoration:underline; /* The text will be underlined */ text-align:right; /* Text will be aligned to right */ margin-right:10px; /* Given some margin 10px to right */ cursor:pointer; /* Making the cursor to 'hand' */}.firstUL{ padding:0px 0px 0px 10px; /* Given some padding to left and 0 padding to top, right, bottom */ margin:0px; /* margin to 0px */ background-color:#3285ef; /* Given background color */}.firstUL li { background:transparent url(images/link_sprite_img.jpg) no-repeat scroll 0 0; /* For all li’s(listings) given default background image using CSS Sprite concept */ display:inline; /* Listings will be placed in a line */ font-family:'Arial',Verdana,Tahoma; /* Setting the font to 'Arial' */ font-size:16pt; /* Setting the font size to 16 points */ font-weight:bold; /* Making the text to bold */ padding:10px 15px 22px; /* Given some padding to top, right, bottom and left */ line-height:70px; /* This property specifies the line height */ cursor:pointer; /* Making the cursor to 'hand' */}.firstUL li.selected{ background:transparent url(images/link_sprite_img.jpg) no-repeat scroll 0px -57px; /* When any listing is highlighted, we are given the background to image using CSS Sprite concept */ color:#ffffff; /* Making the font color 'white' */ font-weight:bold; /* Making text bold */}</style> Explanation of jQuery Code In order to work your jQuery code, as mentioned above in "Adding jQuery to your page" section, we need to include jQuery JavaScript file onto your web page using <script> tag. <!-- jQuery --><script language="javascript" type="text/javascript" src="js/jquery.js"></script> I have downloaded the jQuery file from jQuery site and kept it on my local machine. To see the scrolling effect, you need to include the following plugin: <!-- scrollTo Plugin --><script language="javascript" type="text/javascript" src="js/jquery.scrollTo-min.js"></script> You can get the above plugin at this location—http://plugins.jquery.com/project/ScrollTo The above two .js files should be in included in <head> tag in order to utilize those in our code. jQuery Code <script language="javascript" type="text/javascript">$(document).ready(function() { //below code is for high-lighting the link and scroll to particular DOM Element as well $(".firstUL li").each(function() { $(this).click(function() { //On click of any Alphabet $(".firstUL li").removeClass("selected"); //Initially remove "selected" class if any $(this).addClass("selected"); //Add "selected" class for the clicked one elementClick = $(this).attr("id"); //get respective 'Id' for example 'a','b','c'.. etc., $(".content-container").scrollTo($("#content-for-"+elementClick), 800); //scrollTo particular DOM Element $(".content-container div").css({'background-color' : '#ffffff'}); //set the background color to default, that is white $(".content-container #content-for-"+elementClick).css({'background-color' : '#d2e2fc'}); //set the background color to light-blue to that div }); }); //When "Return to Top" is clicked highlight the first Alphabet that 'A' and scroll to top. $('.return-to-top').click(function(){ $(".firstUL li").each(function() { $(".firstUL li").removeClass("selected"); //Remove classname "selected" }); $("#a").addClass("selected"); //Add a class named "selected" to the first Alphabet $(".content-container").scrollTo($("#content-for-a"), 800); //This is for scrolling to particular element that is "A" here... $(".content-container div").css({'background-color' : '#ffffff'}); //set the background color to default, that is white $(".content-container #content-for-a").css({'background-color' : '#d2e2fc'}); //set the background color to light-blue to that div });});</script> Summary In this article, we saw how to create a Simple Alphabetical Glossary using jQuery. We have learnt how we can highlight particular DOM Element, how we can scroll-to particular div element using scroll-to plugin, and learnt how we can add the background-color to a div using CSS properties.
Read more
  • 0
  • 0
  • 4279

article-image-building-personal-site-using-drupal-6
Packt
01 Oct 2009
10 min read
Save for later

Building a Personal Site Using Drupal 6

Packt
01 Oct 2009
10 min read
Isaac wants his web site to have the following features: An "About me" page—showing his personal profile and interests A page that will list all of his publications A Blog to tell the world what he is currently doing, with a list of the latest blog posts displayed on the front page A Contact form that site visitors can use to send an email to I.M. Smart Theme Smart has chosen the "AD The Morning After" theme (which is a contribution to the Drupal project) because he loves the design. The front page will feature a teaser for Smart's profile at the top of the content area, and a list of his most recent blog posts in a block at the bottom of the front page. The final layout of Smart's web site can be seen in the following screenshot: Build I.M. Smart's site Okay, this guy Smart doesn't appear particularly likeable does he, and isn't this quite typical of university professors? But let's put our prejudices aside for a couple of hours and get his work done for him. The major tasks in building the web site for Isaac Smart will be: To create a new Content type called "Publication", under which he can list all of his work To be able to allocate terms to describe each added work To be able to display a Page view of the list of publications To be able to create a Block view of the list of his daily blog posts To create a simple Contact form Modules In order to create the desired web site, we will be using some essential Drupal modules. Optional Core modules The following optional Core modules will be required: Blog—will enable him create his blog posts Taxonomy—will enable him to classify his blog posts Comment—will allow all visitors to his web site to comment on, and to discuss his blog posts and publications Contact—will allow site visitors to send him personal messages Upload—will allow the upload of files into content Contributed modules The following contributed modules will also be used: Taxonomy Menu—will allow taxonomy vocabularies to be transformed into menus easily IMCE—will give the ability to upload and manage files and images Image—will allow the inclusion of images in content Basic content Smart's site is quite basic. The About Me page can be safely created from the Story Content type, and that is what we are going to do. However, to add an element of danger to the project, we will be including a new Content type for his publications, and we will call it just that—"Publication". Create a new Content type By navigating to the Administer page of the site and then to the Content management section, we will find the Content types link. If we access this page, then we will see the various Content types listed there. Here, we need to create a new Content type for "Publication". To create the "Publication" Content type: Click on the Add content type link at the top of the page. You will then be presented with a form. Add the Content type description and the general rules for the adding and display of content for this new Content type, in the places where they need to be in the form. Here are some guidelines: In the Identification fields, add the Name and the Description of the Content type (in this case "Publication"). In the Submission form settings, you can choose the titles that you want to give the fields. By default, you are presented with Title (for the title of the submission), Body (for the main story), and also fields specifying the minimum length of the article before it can be accepted for submission, as well as another place where you can describe submission guidelines for this Content type. Leave this at the system default setting. In the Workflow setting we need to determine the default options: Do you want the article to be immediately published and available for use on the site, immediately after submission? If so, select the Published checkbox. Do you want to promote the article to the front page? If so, select the Promoted to front page checkbox. Do you want the article to remain at the top of the list of contents on the site? If so, select the Sticky at top of list checkbox. In the Comments settings panel, indicate whether you want to allow comments to be made on articles of this Content type or not, and if you do, how these comments will be handled. As previously mentioned, Smart wants to allow comments to be added to his publications by site visitors. Categorize content We first need to establish how the content is going to be organized for use on the site. This is quite easy because we have created only one new Content type, named Publication, that will have taxonomy terms—Books and Papers—attached to it. By doing this, we will have set the ground rules for how content will be created and displayed on the site. Categories or terms may be used to further classify items that, even though they fall under the same Content type, need to be grouped with others with which they bear a close similarity. In this case, Smart's Publication list includes Books and Papers, which, even though they are both publications, would do well if grouped separately. So we must now create the new categories and establish relationships between these new categories and the new Content type. Go to the Taxonomy link under the Content management section on the Administer page, and click on it to get to the Taxonomy page. If you have started a new site, then at the foot of this page, you will see a notice that there is no vocabulary available for your new categories. The vocabulary is a term by which a collection of categories (or terms) can be collectively described. In this case, let us create a vocabulary that we will call Publications Type. We will do this by clicking on the Add vocabulary link at the top of the page. This is what we will be entering into the form for this new vocabulary: In the Identification panel, let us enter the Vocabulary name, and a Description, as well as any Help text that will guide Smart when he comes across this vocabulary. For Publication, we have used Publications Type as the Vocabulary name. For the Description, we have entered The type of publication. Is it book or paper? For the Help text, we will be instructing Smart to Select appropriate publication. We need to associate this vocabulary with a Content type. We have created it specifically for Publication, so we will naturally select the Publication checkbox. For the Settings, we declare that the selection of a term from this vocabulary is Required, and that Smart must choose a term from the supplied list. Moreover, because a Publication can be either a Book or a Paper but never both, a posted content may not have more than one term associated with it. Therefore, leave all of the other checkboxes with the system default settings. The completed vocabulary page is shown in the following screenshot: On returning to the Taxonomy page, we can see the new vocabulary that we have just created is listed. Now we need to add the terms for the vocabulary. We do this by clicking on the add terms link and completing the form that we will be presented with. At this stage, forget about the Advanced Options link at the bottom, because we only have a single level of terms. If you click on the list terms link on the vocabulary, then you will be presented with a list of the terms that you have created, in the order that these terms will be presented to Smart. If you don't like this order, then just drag the ones you want to change to the location that you want. Test the submission form Now, let us test our content submission form and see how it works. In order to do this, you click on the Create content link (on the lefthand side of your page), and select Publication. You will then get a form, as shown in the following screenshot: Using this form, Smart will be able to post the details of his many publications to his web site. However, he doesn't know a thing about HTML (which proves that he isn't so great after all) and will definitely have problems while uploading images into his posts. So, we will give him an easy way to do this. Images Download the IMCE and Image modules. Install and enable them. It is also essential that you have the Upload module enabled. The TinyMCE editor (even though it is not essential) will permit Smart to edit his pages without knowing any HTML. Download the editor, if this feature is required. Having done this, return to Administer | Content management | Content types, and select the Publication Content type. At the bottom of the page, you will see a new panel for Image Attach settings. Enable Attach images, and now the Publication Content type will be ready to incorporate images. To confirm this, go to the Create content link for the Content type. Near the bottom of the page you will find the Attached images panel, as shown in the following screenshot, where you can upload images for your content. Do the same for the Blog entry, Story, and Page Content types. If you have configured your TinyMCE editor correctly, then you can similarly post images into the Body of your article by using the image upload function in TinyMCE. We will also ensure that the Attach images functionality has been enabled in all of the other Content types. Then, in the Workflow settings for each Content type, deselect the Promoted to front page checkbox, or else you will end up with a very unruly front page display. Create the About Me page The About Me page, as we have decided, should really be quite straightforward and will be created from the Story Content type, which is recommended for content that is static. From the admin menu, click on the Create content link, and then select Story. This will give you a form, which is similar to the following screenshot: The handy WYSIWYG (What You See Is What You Get) editor, which is an emulation of desktop software like MS Word or Open Doc (with which most people will probably be accustomed), will make it easy for Smart to create his personal information page, and format it to his satisfaction. Tips and trapsWe have used this approach because Smart is the only person having a personal profile on this web site. Otherwise, it will not be adequate, and we may have to call up some other modules, especially the CCK module, which will enable us to create new form fields to make submissions more intuitive (for example, to present defined fields for name, education, interests, and so on). Because Smart wants this to feature on the front page, we will just promote the About Me page to the front page before saving it. The Menu settings field is optional, and it is only used if you want to add the item to the menu system. We will add the About Me page to the <Primary links>.
Read more
  • 0
  • 0
  • 1739

article-image-content-drupal-frequently-asked-questions-faq-2
Packt
24 Sep 2009
5 min read
Save for later

Content in Drupal: Frequently Asked Questions (FAQ)

Packt
24 Sep 2009
5 min read
What is content in the context of Drupal? We can certainly say that 'content' is any material that makes up the web page, be it Drupal-generated content, such as the banner and buttons, or user content, such as the text of a blog. Within Drupal, 'content' has more narrow parameters. When you create a story in Drupal, it is stored in a database as a node, and is assigned a node ID (nid). Some would say that, with respect to Drupal, content is limited to objects (stories, and so on) that can receive comments created by users, and are assigned a node id. Others say that it is any object in Drupal that can be on a page. These technical discussions can cause your eyes to glaze over. It would seem that the latter definition makes the most sense; however, there is one additional factor that we need to consider, and that is the layout of the Drupal admin functions. Drupal provides admin functions for creating and maintaining content, and these functions list only those objects that receive a node id. Other objects, such as Blocks, are created and maintained elsewhere. What are the types of content in Drupal? The following table lists the content types that ship with Drupal by default: Content Type Description Blog entry A blog, or weblog, is an author-specific content type that is used as a journal or diary, among other things, by individuals. In Drupal, each blog writer can, depending on the site's settings and their permissions, add attachments, HTML, or PHP code to their blog. A good example of a blog can be found at: http://googleblog.blogspot.com/, which demonstrates an interesting use of the blog content format. Book page A book is an organized set of book page types (actually any type can be used nowadays), which are intended to be used for collaborative authoring. Book pages may be added by different people in order to make up one single book that can then be structured into chapters and pages, or in whatever structure is most appropriate, provided it is in a hierarchical structure. Because pretty much any data type can be added to a book, there is plenty of scope for exciting content (think of narrated or visual content complementing dynamic book pages, created with PHP and Flash animations, to create a truly unique Internet-based book-the possibilities are endless!). A good example of a book is the documentation provided for developers on the Drupal site, found at: http://drupal.org/node/316. This has been built up over time by a number of different authors. You will notice that if you have the Book module enabled, an additional outline tag is presented above all/most of the site's posts. Clicking on this tab allows you to add that post to a book-in this way, books can be built up from content posted to the site. Forum topic Forum topics are the building blocks of forums. Forums can only consist of forum topics and their comments, unlike books, which can consist of pretty much any content type. Information in forums is categorized in a hierarchical structure, and they are extremely useful for hosting discussions as well as community-based support and learning. Forums are abundant on the Internet and you can also visit the Drupal forums to get a feel for how they operate. Page The page type is meant to allow you to add basic, run-of-the-mill web pages that can be found on any site. About us or Terms of use pages are good candidates for the page type, although you can spruce these up with a bit of dynamic content and HTML. Just look on any website to see examples of such pages. What about comments? Comments are not the same as the other node types discussed in the previous table. While there may be exceptions, the terms 'node' and 'content' are synonymous with respect to Drupal. While, technically, they are content, consider the fact that one cannot create a comment without first having another node to add the comment to. Instead, you can tack comments onto other content types, and these are very popular as a means to stimulate discussion among users. You can see comments in action by logging into the Drupal forums, http://drupal.org/forum, and posting or viewing comments on the various topics there. How to work with content types? It is possible to specify some default behavior for each of the content types. To do this, go to Content types under Content management to bring up the following page: Each content type has a set of editable configuration parameters, so to get a good idea of how they work, click on the edit in the Book page row. The edit page is broken up into four sections dealing with the following: Identification – Allows you to specify the human readable name and the name used internally by Drupal for the associated content type, as well as to add a description to be displayed on the content creation page. Submission form settings – Allows you to set the field names for the title and body (leaving the body blank removes the field entirely) as well as specify the minimum number of words required to make the posting valid. Again, it is possible to add in submission guidelines or notes to aid those users posting this content type. Workflow settings – Allows you to set default publishing options, multilingual support, and specify whether or not to allow file attachments. Comment settings – Allows you to specify default comment settings such as read or read/write, whether or not comments are allowed, whether they are to appear expanded or collapsed, in which order and how many, amongst other things.
Read more
  • 0
  • 0
  • 2792
Visually different images

article-image-building-tiny-web-applications-ruby-using-sinatra-2
Packt
03 Sep 2009
5 min read
Save for later

Building tiny Web-applications in Ruby using Sinatra

Packt
03 Sep 2009
5 min read
What’s Sinatra? Sinatra is not a framework but a library i.e. a set of classes that allows you to build almost any kind of web-based solution (no matter what the complexity) in a very simple manner, on top of the abstracted HTTP layer it implements from Rack. When you code in Sinatra you’re bound only by HTTP and your Ruby knowledge. Sinatra doesn’t force anything on you, which can lead to awesome or evil code, in equal measures. Sinatra apps are typically written in a single file. It starts up and shuts down nearly instantaneously. It doesn’t use much memory and it serves requests very quickly. But, it also offers nearly every major feature you expect from a full web framework: RESTful resources, templating (ERB, Haml/Sass, and Builder), mime types, file streaming, etags, development/production mode, exception rendering. It’s fully testable with your choice of test or spec framework. It’s multithreaded by default, though you can pass an option to wrap actions in a mutex. You can add in a database by requiring ActiveRecord or DataMapper. And it uses Rack, running on Mongrel by default. Blake Mizerany the creator of Sinatra says that it is better to learn Sinatra before Ruby on Rails: When you learn a large framework first, you’re introduced to an abundance of ideas, constraints, and magic. Worst of all, they start you with a pattern. In the case of Rails, that’s MVC. MVC doesn’t fit most web-applications from the start or at all. You’re doing yourself a disservice starting with it. Back into patterns, never start with them- Reference here Installing Sinatra      The simplest way to obtain Sinatra is through Rubygems. Open a command window in Windows and type: c:> gem install sinatra Linux/OS X the command would be: sudo gem install sinatra   Installing its Dependencies Sinatra depends on the Rack gem which gets installed along with Sinatra. Installing Mongrel (a fast HTTP library and server for Ruby that is intended for hosting Ruby web applications of any kind using plain HTTP - http://mongrel.rubyforge.org/) is quite simple. In the already open command window, type: c:> gem install mongrel What are Routes? The main feature of Sinatra is defining ‘routes’ as an HTTP verb for a path that executes an arbitrary block of Ruby code. Something like: verb ‘path’ do ... # return/render something end Sinatra’s routes are designed to respond to the HTTP request methods (GET, POST, PUT, DELETE). In Sinatra, a route is an HTTP method paired with an URL matching pattern. These URL handlers (also called "routing") can be used to match anything from a static string (such as /hello) to a string with parameters (/hello/:name) or anything you can imagine using wildcards and regular expressions. Each route is associated with a block. Let us look at an example: get '/' do .. show something ..endget '/hello/:name' do # The /hello portion matches that portion of the URL from the # request you made, and :name will absorb any other text you # give it and put it in the params hash under the key :nameendpost '/' do .. create something ..endput '/' do .. update something ..enddelete '/' do .. delete something ..end Routes are matched in the order they are defined. When a new request comes in, the first route that matches the request is invoked i.e. the handler (the code block) attached to that route gets executed. For this reason, you should put your most specific handlers on top and your most vague handlers on the bottom. A tiny web-application Here’s an example of a simple Sinatra application. Write a Ruby program myapp1.rb and store it in the folder: c:sinatra_programs Though the name of the folder is c:>sinatra_programs, we are going to have only one Sinatra program here. The program is: # myapp1.rbrequire 'sinatra' Sinatra applications can be run directly: ruby myapp1.rb [-h] [-x] [-e ENVIRONMENT] [-p PORT] [-s HANDLER] The above options are: -h # help -p # set the port (default is 4567) -e # set the environment (default is development) -s # specify rack server/handler (default is thin) -x # turn on the mutex lock (default off) – currently not used In the article- http://gist.github.com/54177, it states that using: require ‘rubygems’, is wrong. It is an environmental issue and not an app issue. The article mentions that you might It is an environmental issue and not an app issue. The article mentions that you might use: ruby -rubygems myapp1.rb Another way is to use RUBYOPT. Refer article – http://rubygems.org/read/chapter/3. By setting the RUBYOPT environment variable to the value rubygems, you tell Ruby to load RubyGems every time it starts up. This is similar to the -rubygems options above, but you only have to specify this once (rather than each time you run a Ruby script).
Read more
  • 0
  • 0
  • 5682

article-image-building-news-aggregating-site-using-drupal-6-2
Packt
14 Aug 2009
4 min read
Save for later

Building a News Aggregating Site Using Drupal 6

Packt
14 Aug 2009
4 min read
Weird Hap'nins requirements will be the need to: Get external feed sources and allocate them to menu links on the web site Create the means to automatically fetch and display article items located in the feeds Display blocks of latest content from each feed source on the front page Theme The theme chosen is "Strange Little Town", which is a contributed theme that fits the description of this unique web site. Build Weird Hap'nins Vaughan Pyre is a very ambitious webpreneur. What he really hopes for is a web site that is completely self-maintaining, and on which he can place some Google AdSense blocks. Clicks from the visitors to his site will ensure that he makes lots of money. For this, he needs a site where the content updates regularly with fresh content so that visitors will keep coming back to click on some more Google ads. Vaughan's ultimate objective is to create several of these web sites. Modules This is, surprisingly, a very simple site to build, and much of the requirements can be achieved by using the Core Aggregator module. Indeed, were it not for the fact that Vaughan needs the content to automatically update, we needn't use any module other than the Aggregator module. Optional Core modules We will be using the following Core modules, which can be enabled via the Modules page: Aggregator—for aggregating syndicated content (RSS, RDF, and Atom feeds) Contributed modules We will also be using the following contributed modules from Drupal.org. Install, and enable them via the Modules page: Poormanscron—internal scheduler for users without a cron application Configure the Poormanscron module First we need to enable the Poormanscron module, so that the incoming feeds will be able to self-refresh. From the Administer page, we will access the Poormanscron configuration page, mainly to set the time interval between runs of cron to update feed items, as shown in the following screenshot: In this case, we have left the Time intervals at the default value of 60 minutes. Configure the Aggregator module The Aggregator module should be configured to define the feed sources, how often they will be polled, and how they're categorized. For this, if we select the Feed aggregator link on the Administer page, then we should arrive at the following page: On the Settings page, we will define some more requirements, as follows: Allowed HTML tags—which are the tags that are embedded in the incoming feed that we want Drupal to accept. The allowed tags do not include image tags. So if any images are coming with the feed, then they will be excluded. However, we don't want this to happen, so we have added the image tag <img> to the list. Items shown in sources and categories pages—we have defined this to be 20 items, but you may select another figure. Discard items older than—we want the feed items to be completely refreshed every week so we have set this at 1 week. Category selection type—we are not categorizing the feeds, so we will leave this setting as it is. Basic content The site is built around the Aggregator module, and no other Content type will need to be created. Vaughan has decided to initially use three feeds obtained from www.newsfeedmaker.com, as follows: Bad News—http://www.newsfeedmaker.com/feed.php?code=ddb874f7 Crime—http://www.newsfeedmaker.com/feed.php?code=33a5a46a Paranormal—http://www.newsfeedmaker.com/feed.php?code=936f006a It is from these feeds that we will create the necessary content. Tips and trapsAn excellent source for "mashup" feeds on any topic is pipes.yahoo.com. Add feeds On the Add feeds page, which is under the Feed aggregator configuration page, we finally get to define our feeds, and how often we want them to be polled. We want our Bad News feed to be polled every hour, so we have configured it this way. The same procedure is followed to create the feeds for Crime and Paranormal.
Read more
  • 0
  • 0
  • 2783
Unlock access to the largest independent learning library in Tech for FREE!
Get unlimited access to 7500+ expert-authored eBooks and video courses covering every tech area you can think of.
Renews at €14.99/month. Cancel anytime