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

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 star

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

cre-ate 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 $wgDefaultSkinvariable 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

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

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 warnrevert-ings

Drupal

Drupal is a general-purpose content management system that continues to gain

popular-ity 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

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

modi-fying 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

FIGURE 22.12

Creating your

Drupal site.

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

navi-gation 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

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

administra-tive interface

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

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 conwrit-tent, 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

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

22

FIGURE 22.15

The Drupal Garden

theme selection

interface.

FIGURE 22.16

The Drupal Garden

theme-selection

interface.

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

flexi-bility 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

pub-lish 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

informa-tion 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

FIGURE 22.17

The Flickr Creative

Commons page.

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

require-ments 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

FIGURE 22.18

The Flickr All Sizes

page for a photo I

uploaded.

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

infor-mation 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

spe-cial applications that are espespe-cially 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

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

wid-get, shown in Figure 22.19, along with a button that generates the HTML to embed the

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