Tự học HTML và CSS trong 1 giờ - part 71 potx

ptg your database configuration settings right on the installation page. If you have root (administrator) access to your MySQL server, MediaWiki will even create a dedicated database and user for you. If you’re using shared hosting, you’ll probably have to enter the database name and login information for your database and then let MediaWiki create its tables. MediaWiki, like WordPress, lets you pick a prefix for your table names so that you can avoid naming conflicts if multiple applications use the same database. After setup is complete, MediaWiki requests that you move the configuration file it created to the proper location, and then you can begin editing content. If everything is set up properly, MediaWiki installation can be painless. Unfortunately, with these types of applications, there’s always an opportunity for something to go wrong. If you run into trouble, check out the MediaWiki installation guide: http://www.mediawiki.org/wiki/Manual:Installation The settings for MediaWiki are found in the file LocalSettings.php, which MediaWiki may have generated for you. You can find a full list of configuration settings at the fol- lowing location: http://www.mediawiki.org/wiki/Help:Configuration_settings MediaWiki will work fine with the default settings, but you’ll probably at least want to add your own logo to replace the placeholder image. MediaWiki also supports themes, which are called skins in the MediaWiki world. A big list of skins that you can download and install can be found here: http://www.mediawiki.org/wiki/Gallery_of_user_styles Users can change their personal settings to use any skin that’s installed. To change the default skin for the site, edit the $wgDefaultSkin variable in your LocalSettings.php file. Using MediaWiki After you have MediaWiki set up however you like, you can start entering content of your own. If you go with the default installation, anyone who sees your site can start entering content of her own. Every page in a wiki has an edit link on it, allowing you to jump in and make changes. To add an internal link in MediaWiki, you enclose the name of the page in double square brackets, like this: [[My New Page]] When you click the link, you’ll be asked to fill in the body of the new page. That’s all there is to it. You can also create a new page by entering its name directly into the URL. If you enter a URL, such as http://localhost:8888/mediawiki/index.php/Flying_Monkeys, and a page named “Flying Monkeys” does not exist, it will be created automatically. 676 LESSON 22: Content Management Systems and Publishing Platforms Download from www.wowebook.com ptg Wikis tend to grow organically; as people need new pages, they create them by linking to them. With a wiki, it’s easy to move content from one page to another, split one long page into several smaller pages, and generally manage your content however you see fit. MediaWiki keeps track of every change made to every page. On each page, you see a History tab that you can click on to see all the edits ever made to that page. The history page for the sandbox page on the MediaWiki site appears in Figure 22.11. Drupal 677 22 FIGURE 22.11 The edit history for a wiki page. From the History page, you can compare revisions of a page or view the old revisions. To revert a page back to the old version, view that version, click Edit, and then save the page. MediaWiki will warn you that you’re replacing newer content, but if you’re revert- ing changes, you can ignore the warnings. Drupal Drupal is a general-purpose content management system that continues to gain popularity. Out of the box, it is set up to create a blog-like site that allows authors to publish news and allows the public to log in and comment on the stories. Unlike applications like WordPress and TypePad that are strongly focused on publishing blogs, Drupal supports a wide variety of applications. Drupal provides flexibility in three main ways. The first is that a large numbers of modules are available to provide new functionality. There are Drupal modules that allow you to manage members in an organization, set up and operate an online store, or integrate with other sites. The second is that the functionality of the Drupal core and most of the modules can be customized through a web interface without any programming required. Download from www.wowebook.com ptg So, if you want to add a pet registry to a Drupal site, you could add a new content type for pets with its own custom fields without modifying the database on your own or modifying the Drupal source code at all. And finally, like WordPress, Drupal supports themes, enabling you to customize the look and feel of a Drupal site. The installation and setup of Drupal is similar to the process for WordPress and MediaWiki. It’s also a PHP application that uses MySQL as its database. Setting it up as is as simple as updating the configuration file, uploading the application, and then per- forming the steps advised in the web interface. Instead of walking you through the precise steps to install yet another application, I’ll go straight into talking about some of the things you can do with Drupal. If you do want to install it, you can check out the installation guide at http://drupal.org/getting- started/install. If you prefer, you can set up a hosted Drupal site at Drupal Gardens (http://drupalgardens.com/). There’s an advertising-supported version of Drupal available there that you can use for free, and there are ad-free options to which you can subscribe. Using Drupal The easiest way to get started with Drupal is to sign up for a free account with Drupal Gardens. After you’ve registered for a new account, you just have to choose a URL for your site, and then you can start creating the site. Drupal Gardens starts by asking you which features you’re going to want to set up out of the box, as shown in Figure 22.12. 678 LESSON 22: Content Management Systems and Publishing Platforms FIGURE 22.12 Creating your Drupal site. Download from www.wowebook.com ptg After you’ve set up your site, you can begin to customize its look and feel and start entering content. Drupal’s administrative interface shows the page as it will look to end users, along with some menus and controls that are visible only to administrators. As you can see in Figure 22.13, the main area of the page features the default template and some placeholder content, such as the default slogan and site name. The gray and black navigation bars across the top of the screen are the administrative controls. So, for example, to update your site name and slogan, you click the Configuration button and then click Site Information in the Configuration dialog box. Drupal 679 22 FIGURE 22.13 The home page of a new Drupal site. Drupal supports two kinds of content. There are blocks, which are reusable chunks of content that are used throughout the site. Blocks include things such as navigation menus, search forms, or lists of recently posted content. Drupal themes are split up into regions, and administrators can place blocks in whatever region they like. Clicking the Structure button enables you to create blocks and assign them to various regions on the page. New Drupal sites already provide a number of commonly used blocks, arranged into appropriate regions in the layout. They can all be rearranged through the administrative interface. Nodes are the second type of content. Unlike blocks, which are reused throughout the site, nodes are individual bits of content that may be found in lists that are displayed in blocks, and which have their own detail pages. Nodes include things such as web pages, articles, blog entries, forum posts, and photos. One of the big parts of setting up your Download from www.wowebook.com ptg Drupal site is deciding which types of nodes will be part of it. Nodes are the “content” in the content management system. To create new nodes or manage the nodes that already exist, you can click the Content button in the navigation. When you do so, the Content dialog, shown in Figure 22.14, will be displayed. 680 LESSON 22: Content Management Systems and Publishing Platforms FIGURE 22.14 The Drupal Content dialog. As you can see, the dialog provides a list of existing content, enabling the administrator to add new content or manage the content that already exists. When you click the Add New Content link, you’re given the option of Drupal provides a WYSIWYG editor writ- ten in JavaScript for editing content, and also provides the option of editing the HTML source for the content, too. To change the appearance of your site, you can select a new theme, and then modify by choosing an alternate color scheme or even editing the styles of individual elements on the page. You can see the Theme selection interface in Figure 22.15. After you’ve selected a theme, you can further customize the look and feel of your site using the Brand, Layout, and Styles buttons. The Advanced button enables you to add custom Cascading Style Sheets (CSS) to your site if you need to further customize your site. Download from www.wowebook.com ptg Finally, you can change the functionality of your site by enabling and disabling modules. To do so, you click the Modules button in the top navigation bar, which will reveal the Module configuration page, shown in Figure 22.16. If you want to remove the forum functionality from your site, you just go to the Module configuration page and disable the Forum module. If you want to enable Google Analytics for your site, you can enable the Google Analytics module. The ability to control the functionality of your site by enabling and disabling modules is one of the key advantages of Drupal. If you set up your own copy of Drupal, you can also download and install modules on your own. Drupal 681 22 FIGURE 22.15 The Drupal Garden theme selection interface. FIGURE 22.16 The Drupal Garden theme-selection interface. Download from www.wowebook.com ptg As you can see from the screenshots, there’s a lot more to Drupal than the few simple concepts I introduced. The popularity of Drupal is growing because it provides the flexibility to create many kinds of sites without requiring programming skills on the part of the programmer. The downside is that Drupal is rather complex. If you just want to publish a weblog or a few static pages, applications like TypePad and WordPress are easier to get started with. However, if your site will eventually grow to encompass many kinds of features, you may find that Drupal better suits your requirements. Incorporating Dynamic Content from Other Sites into Your Pages One alternative to content management systems is to create your content in a hosted web application and then use widgets provided by that application to integrate the content into your own web pages. You’ve already learned how to embed videos hosted by YouTube into web pages. It turns out that many other sites provide the same functionality. The modern Web is all about integrating sites to take advantage of the strengths of each. It’s common to set up a blog or website using a tool like WordPress and then to augment the capabilities of that software by incorporating content from other sites, too. So, you can use your content management system for what it’s best at, and you can use other sites for what they’re best at, and incorporate it all into a single website. In this section, I talk about widgets because they’re easy to use. You go to a website, enter the information you need to create the widget, and then paste the embed code into your page, just as you would with a YouTube video. These sites also provide ways to integrate their content into your site that you can take advantage of with your favorite server-side programming language, but such techniques are beyond the scope of this book. You may want to look into plug-ins for your content management system that can be used to pull content from the sites that you use into your own site. Using Photos from Flickr Flickr (http://flickr.com) is a popular photo hosting site owned by Yahoo! Flickr is a photo sharing community. You can upload your own photos, view and comment on other people’s photos, and create groups and photo pools. You can also use photos on Flickr on your own site. Many Flickr users license their photos under terms that allow them to be used on other websites. If you want to use a photo of a willow tree to post on your own site, you can find a properly licensed photo on Flickr to use rather than taking one yourself. To find photos, go to http://www.flickr.com/creativecommons/, shown in Figure 22.17. 682 LESSON 22: Content Management Systems and Publishing Platforms Download from www.wowebook.com ptg FIGURE 22.17 The Flickr Creative Commons page. Incorporating Dynamic Content from Other Sites into Your Pages 683 22 All the photos available through that page are licensed under a Creative Commons licenses. These licenses are defined on the page, but in short, photos shared under these licenses are legal to share, as long as you follow the terms in the license. For example, a photo shared under a Noncommercial Attribution license can be used but not to make money and also requires that the person using the photo credit the person who owns it when it’s shared. You just need to find the license that is compatible with your project in the list and click See More. From there, you can use the search form to search for images that satisfy your requirements. From there, you can download the images and then use them on your own site. Just go to the detail page, click All Sizes in the Actions menu above the photo, and you’ll be taken to the page that shows all the image sizes available, shown in Figure 22.18. Flickr’s Community Guidelines state that you must link back to the Flickr page for a photograph when you use that photograph on another site. If the photo uses a Creative Commons license that may not necessarily be the case, but it’s still polite to do so. NOTE Download from www.wowebook.com ptg FIGURE 22.18 The Flickr All Sizes page for a photo I uploaded. 684 LESSON 22: Content Management Systems and Publishing Platforms The All Sizes pages for photos you upload include the code you need to use the pho- tographs on your own site. If you publish a blog, or a regular website with a blog-based content management system, you can also set up Flickr so that photo detail pages include a Blog This button that makes it easy to use photos on Flickr on your site. To do so, go to Your Account, then click the Sharing & Extending tab, and then add them in the Your Blogs section. Embedding Twitter Content Twitter is a social site that enables users to posts messages less than 140 characters long. When you sign up for a Twitter account, you can sign up to follow other people and a feed will be created containing all the posts that they write. Likewise, people can sign up to follow your posts. Not only is Twitter widely used by people to keep track of what their friends are up to, but it’s also used to by businesses to post special offers and information about their products, and by publications and blogs to let people know what they’re publishing on their sites. For example, my favorite ice cream place posts their fla- vor of the day on Twitter every day at around noon. You can follow Twitter using the website at http://twitter.com/, or you can download special applications that are especially designed to work with the site. As a web publisher, you can also incorporate content from Twitter into your own site. For more information, go to http://twitter.com/goodies/widgets. It provides a website that will publish tweets (that’s the name for individual posts on Twitter) from a single user, from a list of users, or search results for a particular term. Let’s look at how to create a Twitter widget for one user’s tweets. Download from www.wowebook.com ptg The widget for a single user is called the Profile Widget; to create the widget; go to http://twitter.com/goodies/widget_profile and then enter the name of the Twitter user whose tweets will appear in the widget. Twitter will then provide a preview of the widget, shown in Figure 22.19, along with a button that generates the HTML to embed the widget in your own web page. Incorporating Dynamic Content from Other Sites into Your Pages 685 22 FIGURE 22.19 Preview of the Twitter Profile widget. You can then take the code that is generated and paste it into your own web page to incorporate the widget into your site. Integrating with Facebook Like Twitter, Facebook provides a number of features for developers that enable you to integrate its features into your own site. Whereas Twitter’s approach is to allow you to use content from Twitter on your site, Facebook’s approach is about letting you integrate your site into Facebook. However, Facebook has many millions of users, and integration with Facebook can be a compelling feature for your users. One of the simplest ways to integrate Facebook with your site is to add a Like button. When Facebook users click the button, the page that they’re on will be shared in their activity feed on Facebook. So, if you write an article on the best way to grill a hamburger, Download from www.wowebook.com . The history page for the sandbox page on the MediaWiki site appears in Figure 22 .11 . Drupal 677 22 FIGURE 22 .11 The edit history for a wiki page. From the History page, you can compare revisions. revert- ing changes, you can ignore the warnings. Drupal Drupal is a general-purpose content management system that continues to gain popularity. Out of the box, it is set up to create a blog-like. download and install modules on your own. Drupal 6 81 22 FIGURE 22 .15 The Drupal Garden theme selection interface. FIGURE 22 .16 The Drupal Garden theme-selection interface. Download from www.wowebook.com ptg As