INCOL capa SitesD.

qxd 19/05/2005 11:59 Page 1

0 0 0 1 8>

9 771807 924004
menu/carta do editor 24.05.05 12:44 Page 3

CONTEÚDO

SITES DINÂMICOS
CMS
Wiki
MySQL
RSS
PHP...

FERRAMENTAS 37 > O SSI dispensa banco

7 > Que idioma o site e script
vai falar? 40 > Mais poder ao
14 > O XML desliza no PHP 5 Studio MX
16 > Ganhe tempo com
o ColdFusion
19 > Dados livres com
o MySQL
25 > O Access manda bem
na internet
27 > Banco de dados assim
é ótimo!
29 > Portal é com o Xoops
32 > O osCommerce faz a loja
35 > Páginas abertas ao
conteúdo 32 Loja com osCommerce:
visual muda com os temas

© ILUSTRAÇÕES DA CAPA E DO CONTEÚDO CELLUS COLEÇÃO INFO > 3

menu/carta do editor 24.05.05
CONTEÚDO
45 PHP-Nuke: todos os recursos
no Menu de Administração
reúne recursos
TUTORIAIS
45 > Monte o site rapidinho
50 > Página dinâmica sem
programar
53 > Adeus, tabelas de HTML
57 > Blog pronto em seis
passos
60 > Som e vídeo jorram
da tela
65 > Falem mal, mas falem
do meu site
70 > Mostruário vapt-vupt
75 > O PHP conversa com
os clientes online
65
Livro de visitas:
formulário e mensagens
4 < COLEÇÃO INFO
12:45 Page 4
79 > Dê seu voto para o Flash
84 > Os segredos do ranking
88 > Loja com um Flash
simples
92 > Site esperto lê os feeds
96 > Notícias no palmtop
99 > Que nota o site merece?
101 > Os menus se desdobram
104 > Boletim? É com o
Dreamweaver
107 > Um fórum cheio
de opinião
DOWNLOADS
110 > Portal no ar sem
gastar nada
110 Mambo: gerenciador de
banner e newsfeeds
EQUIPE
EDIÇÃO Lucia Reggiani
CAPA Jefferson Barbato
COLABORADORES Daniel Avizu, Everson
Stabenow Siqueira e Rita Del Monaco
DESIGN Claudia Ottelinger e Osmar Vieira
MUITO ALÉM
DO HTML
emos duas notícias para
T os donos de sites feitos
em HTML puro, uma boa
e outra melhor ainda. A
boa é que dá para montar um site so-
fisticado, cheio de interatividade, sem
tirar um real furado do bolso. A me-
lhor notícia é que reunimos nesta edi-
ção o que há de novo e importante
para a construção de um site dinâmi-
co, gastando nada ou muito pouco.
Dividido em duas partes principais,
Sites Dinâmicos traz, na primeira, fer-
ramentas testadas pelos programa-
dores e jornalistas que participaram
desta edição. Apresentamos as lingua-
gens mais usadas, bancos de dados,
destrinchamos tecnologias de auto-
mação, como o gerenciamento de con-
teúdo (CMS), editores e aplicativos.
Na segunda parte, estão os tutoriais,
o caminho das pedras para fazer seu
site trocar informações com os visi-
tantes automaticamente. Você vai sa-
ber, passo a passo, como construir por-
tais e layouts para comércio eletrôni-
RECADO DA REDAÇÃO
co. Aprenderá a incluir em seu site for-
mulários, livro de visitas, catálogo de
produtos e um alimentador de notí-
cias para PCs e palmtops. Descobrirá
o uso dinâmico do Flash na monta-
gem de um ranking e de um sistema
de votação. Receitas para a produção
de fórum, blog, streaming de áudio e
vídeo estão no cardápio. Temos ain-
da dicas para fazer um layout sem ta-
belas de HTML, o famoso tableless, a
tecnologia da hora para encolher o
código, e uma bela seleção de down-
loads. Em boa parte dos tutoriais você
terá, de bandeja, os códigos prontos
para baixar no site da INFO.
Para encarar essa maratona, a úni-
ca coisa que você precisa é conhe-
cer pelo menos um pouco de algu-
ma linguagem de
programação de
acesso a banco de
dados. Está pronto?
Então aproveite.
LUCIA REGGIANI
EDITORA DE SITES DINÂMICOS
INFO COLEÇÃO
Uma publicação mensal da Editora Abril
Para contatar a redação:
atleitorinfo@abril.com.br
Para assinar a Coleção:
(11) 3347.2121 — Grande São Paulo
0800-701-2828 — Demais localidades
abril.assinaturas@abril.com.br
COLEÇÃO INFO > 5
menu/carta do editor 24.05.05
CONTEÚDO
45 PHP-Nuke: todos os recursos
no Menu de Administração
reúne recursos
TUTORIAIS
45 > Monte o site rapidinho
50 > Página dinâmica sem
programar
53 > Adeus, tabelas de HTML
57 > Blog pronto em seis
passos
60 > Som e vídeo jorram
da tela
65 > Falem mal, mas falem
do meu site
70 > Mostruário vapt-vupt
75 > O PHP conversa com
os clientes online
65
Livro de visitas:
formulário e mensagens
4 < COLEÇÃO INFO
12:45 Page 4
79 > Dê seu voto para o Flash
84 > Os segredos do ranking
88 > Loja com um Flash
simples
92 > Site esperto lê os feeds
96 > Notícias no palmtop
99 > Que nota o site merece?
101 > Os menus se desdobram
104 > Boletim? É com o
Dreamweaver
107 > Um fórum cheio
de opinião
DOWNLOADS
110 > Portal no ar sem
gastar nada
110 Mambo: gerenciador de
banner e newsfeeds
EQUIPE
EDIÇÃO Lucia Reggiani
CAPA Jefferson Barbato
COLABORADORES Daniel Avizu, Everson
Stabenow Siqueira e Rita Del Monaco
DESIGN Claudia Ottelinger e Osmar Vieira
MUITO ALÉM
DO HTML
emos duas notícias para
T os donos de sites feitos
em HTML puro, uma boa
e outra melhor ainda. A
boa é que dá para montar um site so-
fisticado, cheio de interatividade, sem
tirar um real furado do bolso. A me-
lhor notícia é que reunimos nesta edi-
ção o que há de novo e importante
para a construção de um site dinâmi-
co, gastando nada ou muito pouco.
Dividido em duas partes principais,
Sites Dinâmicos traz, na primeira, fer-
ramentas testadas pelos programa-
dores e jornalistas que participaram
desta edição. Apresentamos as lingua-
gens mais usadas, bancos de dados,
destrinchamos tecnologias de auto-
mação, como o gerenciamento de con-
teúdo (CMS), editores e aplicativos.
Na segunda parte, estão os tutoriais,
o caminho das pedras para fazer seu
site trocar informações com os visi-
tantes automaticamente. Você vai sa-
ber, passo a passo, como construir por-
tais e layouts para comércio eletrôni-
RECADO DA REDAÇÃO
co. Aprenderá a incluir em seu site for-
mulários, livro de visitas, catálogo de
produtos e um alimentador de notí-
cias para PCs e palmtops. Descobrirá
o uso dinâmico do Flash na monta-
gem de um ranking e de um sistema
de votação. Receitas para a produção
de fórum, blog, streaming de áudio e
vídeo estão no cardápio. Temos ain-
da dicas para fazer um layout sem ta-
belas de HTML, o famoso tableless, a
tecnologia da hora para encolher o
código, e uma bela seleção de down-
loads. Em boa parte dos tutoriais você
terá, de bandeja, os códigos prontos
para baixar no site da INFO.
Para encarar essa maratona, a úni-
ca coisa que você precisa é conhe-
cer pelo menos um pouco de algu-
ma linguagem de
programação de
acesso a banco de
dados. Está pronto?
Então aproveite.
LUCIA REGGIANI
EDITORA DE SITES DINÂMICOS
INFO COLEÇÃO
Uma publicação mensal da Editora Abril
Para contatar a redação:
atleitorinfo@abril.com.br
Para assinar a Coleção:
(11) 3347.2121 — Grande São Paulo
0800-701-2828 — Demais localidades
abril.assinaturas@abril.com.br
COLEÇÃO INFO > 5
expediente sites dinâmicos 23.05.05 16:21 Page 4

Fundador: VICTOR CIVITA

(1907-1990)
Editor: Roberto Civita
Conselho Editorial: Roberto Civita (Presidente), Thomaz Souto Corrêa (Vice-Presidente),
Jose Roberto Guzzo, Maurizio Mauro
Presidente Executivo: Maurizio Mauro
Diretor Secretário Editorial e de Relações Institucionais: Sidnei Basile
Vice-Presidente Comercial: Deborah Wright
Diretora de Publicidade Corporativa: Thais Chede Soares B. Barreto

Diretor-Geral: Jairo Mendes Leal

Diretor Superintendente: Paulo Nogueira
Diretor de Núcleo: Alexandre Caldini

Diretora de Redação: Sandra Carvalho

Redatora-chefe: Débora Fortes Diretor de Arte: Rodrigo Maroja
Editores Seniores: Carlos Machado, Lucia Reggiani e Maurício Grego
Editores: Airton Lopes, André Cardozo e Eric Costa
Repórteres: Luciana Benatti e Silvia Balieiro Revisora: Marta Magnani
Editor de Arte: Jefferson Barbato Designers: Catia Herreiro e Wagner Rodrigues
Colaborador: Dagomir Marquezi Infolab: Osmar Lazarini (consultor de sistemas)
Colaborador: Eduardo Kalnaitis Estagiários: Bruno Roberti, Henrique Lourenço e Luiz Cruz
Info Online: Renata Verdasca e Cristian Medeiros (webmasteres)
Atendimento ao leitor: Virgílio Souza
www.info.abril.com.br
Apoio Editorial: Beatriz de Cássia Mendes, Carlos Grassetti Serviços Editoriais: Wagner Barreira
Depto. de Documentação e Abril Press: Grace de Souza
PUBLICIDADE
Diretor de Publicidade: Sergio Amaral
Diretor de Publicidade Regional: Jacques Baisi Ricardo Diretor de Publicidade Rio de Janeiro: Paulo Renato Simões
Executivos de Negócios: Letícia Di Lallo, Marcelo Cavalheiro, Márcio Mendonça Pereira, Robson Monte, Rodrigo Floriano
de Toledo (SP) e Edson Melo (RJ) Gerentes de Publicidade: Marcos Peregrina Gomez (SP) e Rodolfo Garcia (RJ)
Executivos de Contas: Luciano Almeida, Marcello Almeida, Renata Miolli, Cristiano Rygaard e Yann Gellineaud (RJ)
NÚCLEO ABRIL DE PUBLICIDADE
Diretor de Publicidade: Pedro Codognotto
Gerentes de Vendas: Claudia Prado, Fernando Sabadin Gerente de Classificados: Cris Lago
MARKETING E CIRCULAÇÃO
Marketing: Marcelo Moraes Gerente de Produto: Gabriela Nunes Marketing Publicitário e Projetos Especiais: Érica Lemos
Gerente de Circulação Avulsas: Maria Helena Couto Gerente de Circulação Assinaturas: Euvaldo Nadir Lima Júnior
Planejamento, Controle e Operações: Auro Iasi, Fábio Luis dos Santos e Tales Bombicini
Projetos Especiais: Cristiana Cardoso Processos: Alberto Martins e Ricardo Carvalho
ASSINATURAS
Diretora de Operações de Atendimento ao Consumidor: Ana Dávalos Diretor de Vendas: Fernando Costa
Em São Paulo: Redação e Correspondência: Av. das Nações Unidas, 7221, 14º andar, Pinheiros, CEP 05425-902, tel. (11) 3037-2000, fax (11) 3037-2355
Publicidade: (11) 3037-5000, Central-SP (11) 3037-6564 Classificados: 0800-132066, Grande São Paulo 3037-2700, www.publiabril.com.br. Escritórios e
Representantes de Publicidade no Brasil: Belo Horizonte – R. Fernandes Tourinho, 147, sala 303, Bairro Savassi, CEP 30112-000, Vania R. Passolongo, tel. (31)
3282-0630, fax (31) 3282-8003 Blumenau – R. Florianópolis, 279, Bairro da Velha, CEP 89036-150, M. Marchi Representações, tel. (47) 329-3820, fax (47) 329-6191
Brasília – SCN - q. 1, bl. Ed. Brasília Trade Center, 14º andar, sl. 1408, CEP 70710-902, Solange Tavares, tel. (61) 315-7554/55/56/57, fax (61) 315-7558 Campinas –
R. Conceição, 233, 260 andar, cj. 2613/2614, CEP 13010-916, CZ Press Com. e Representações, telefax (19) 3233-7175 Cuiabá – R. Diamantino, 13, quadra 73, Morada
da Serra, CEP 78055-530, tel. (65) 3027-2772 Curitiba – Av. Cândido de Abreu, 776, 6º andar, sl. 601 e 602, Centro Cívico, CEP 80530-000, Marlene Hadid, tel. (41)
250-8000, fax (41) 252-7110 Florianópolis – R. Manoel Isidoro da Silveira, 610, sl. 301, Comercial Via Lagoa - Lagoa da Conceição, CEP 88060-130, Comercial Lagoa,
Via Lagoa da Conceição, tel. (48) 232-1617, fax (48) 232-1782 Fortaleza – Av. Desembargador Moreira, 2020, sl. 604/605, Aldeota, CEP 60170-002, Midiasolution
Repres e Negóc. em Meios de Comunicação, telefax (85) 264-3939 Goiânia – R. 10, nº 250, loja 2, Setor Oeste, CEP 74120-020, Middle West Representações Ltda., tel.
215-3274/3309, telefax (62) 215-5158 Joinville – R. Dona Francisca, 260, sl. 1304, Centro, CEP 89201-250, Via Mídia Projetos Editoriais Mkt. e Repres. Ltda., telefax
(47) 433-2725 Londrina – R. Adalcimar Regina Guandalini, 392, Jd. das Américas, CEP 86076-100, Press Representações e Publicidade, telefax (43) 3357-1122 - r. 24
Porto Alegre – Av. Carlos Gomes, 1155, sl. 702, Petrópolis, CEP 90480-004, Ana Lúcia R. Figueira, tel. (51) 3327-2850, fax (51) 3227-2855 Recife – R. Ernesto de
Paula Santos, 187, sl. 1201, Boa Viagem, CEP 51021-330, MultiRevistas Publicidade Ltda., telefax (81) 3327-1597 Ribeirão Preto – R. João Penteado, 190, CEP
14025-010, Intermídia Repres. e Publ. S/C Ltda., tel. (16) 635-9630, telefax (16) 635-9233 Rio de Janeiro – Praia de Botafogo, 501, 1º andar, Botafogo, Centro
Empresarial Mourisco, CEP 22250-040, Paulo Renato L. Simões, pabx (21) 2546-8282, tel. (21) 2546-8100, fax (21) 2546-8201 Salvador – Av. Tancredo Neves, 805, sl.
402, Ed. Espaço Empresarial, Pituba, CEP 41820-021, AGMN Consultoria Public. e Representação, telefax (71) 341-4992/4996/1765 Vitória – Av. Rio Branco, 304, 2º
andar, loja 44, Santa Lúcia, CEP 29055-916, DU’Arte Propaganda e Marketing Ltda., telefax (27) 3325-3329
Publicações da Editora Abril: Veja: Veja, Veja São Paulo, Veja Rio, Vejas Regionais Negócios: Exame, Você S/A A Consumo/Comportamento: Núcleo
Consumo: Boa Forma, Elle, Estilo, Manequim Núcleo Comportamento: Claudia, Nova Núcleo Bem-Estar: : Bons Fluidos, Saúde!, Vida Simples
Turismo/Tecnologia: Núcleo Turismo: Guias Quatro Rodas, National Geographic, Viagem e Turismo Núcleo Homem: : Placar, Playboy, Quatro Rodas, Vip Núcleo
Tecnologia: Info, Info Corporate Cultura/Jovem: Núcleo Jovem: Capricho, Mundo Estranho, Superinteressante, Super Surf Núcleo Infantil: Atividades, Disney,
Recreio Núcleo Cultura: : Almanaque Abril, Guia do Estudante, Aventuras na História, Revista das Religiões Casa/Semanais: Núcleo Casa e Construção:
Arquitetura e Construção, Casa Claudia, Claudia Cozinha Núcleo Celebridades: Contigo! Núcleo Semanais: Ana Maria, Faça e Venda, Minha Novela, Tititi, Viva!
Mais Fundação Victor Civita: Nova Escola
INTERNATIONAL ADVERTISING SALES REPRESENTATIVES Coordinator for International Advertising: Global Advertising, Inc., 218 Olive Hill Lane, Wood-
side, California 94062. UNITED STATES: CMP Worldwide Media Networks, 2800 Campus Drive, San Mateo, California 94403, tel. (650) 513 4200, fax (650) 513 4482.
EUROPE: HZI International, Africa House, 64-78 Kingsway, London WC2B 6AH, tel. (20) 7242-6346, fax (20) 7404-4376. JAPAN: IMI Corporation, Matsuoka Bldg. 303,
18-25, Naka 1- chome, Kunitachi, Tokyo 186-0004, tel. (03) 3225-6866, fax (03) 3225-6877. TAIWAN: Lewis Int’l Media Services Co. Ltd., Floor 11-14 no 46, Sec 2,
Tun Hua South Road, Taipei, tel. (02) 707-5519, fax (02) 709-8348
SITES DINÂMICOS! edição 18 é uma publicação da Editora Abril S.A. Distribuída em todo o país pela Dinap S.A.
Distribuidora Nacional de Publicações, São Paulo.

IMPRESSA NA DIVISÃO GRÁFICA DA EDITORA ABRIL S.A.

Av. Otaviano Alves de Lima, 4400, CEP 02909-900 - Freguesia do Ó - São Paulo - SP

Presidente do Conselho de Administração: Roberto Civita

Presidente Executivo: Maurizio Mauro
Vice-Presidentes: Deborah Wright, Emílio Carazzai, José Wilson Armani Paschoal, Valter Pasquini
www.abril.com.br
FERRAMENTAS/LINGUAGEM 1 23.05.05 16:23 Page 7

FERRAMENTAS/LINGUAGENS

QUE IDIOMA O
SITE VAI FALAR?
ANTES DE ESCOLHER, CONHEÇA AS CARACTERÍSTICAS DE
PHP, ASP, COLDFUSION, PERL E JSP
POR ANDRÉ CARDOSO

ites complexos como os Perl, PHP, JSP e ColdFusion. Corren-

S portais e as lojas online

exigem do desenvolve-
dor muito mais do que
destreza com o velho e bom HTML.
É preciso aprender a programar nu-
ma linguagem de acesso a banco de
dados. As mais usadas pelos web-
masters são pelo menos cinco: ASP,
do por fora, ASP.Net e J2EE prome-
tem ganhar espaço com sua arqui-
tetura de componentes. Cada uma
dessas linguagens tem suas vanta-
gens e desvantagens, e a escolha de-
pende de uma série de fatores, co-
mo compatibilidade, custo e porta-
bilidade. Conheça melhor as opções.

© ILUSTRAÇÃO PAVÃO COLEÇÃO INFO > 7

FERRAMENTAS/LINGUAGEM 1 23.05.05 16:23 Page 8

FERRAMENTAS/LINGUAGENS FERRAMENTAS/LINGUAGENS

ASP, A OPÇÃO
WINDOWS
O ASP (Active
Server Pages) é
a plataforma da
Microsoft para a criação de sites di-
nâmicos. Em vez de utilizar o mé-
todo CGI (Common Gateway Inter-
face), as páginas ASP consultam o
banco de dados por meio do Isapi
(Internet Server Application Pro-
gramming Interface), que aprimo-
ra a comunicação entre o servidor
e o aplicativo externo.
Quando utilizamos o CGI, cada
pedido de página abre um novo
processo no servidor, o que pode
comprometer o desempenho do si-
te. Já com o Isapi, o processamen-
to de todos os pedidos ao servidor
fica a cargo de um único arquivo
.dll, que, uma vez carregado na me-
mória, permanece lá até que seja
deliberadamente retirado.
O funcionamento de páginas ASP
depende do arquivo asp.dll. É ele
que trata todos os pedidos de exe-
cução das páginas ASP. É importan-
te lembrar que o ASP não é exata-
mente uma linguagem de progra-
mação, mas o que a Microsoft de-
fine como “ambiente de execução
de scripts”. Na maior parte das ve-
zes, as instruções são escritas em
VBScript, que é derivado do Visual
Basic, também filhote da Microsoft.
A penetração do Visual Basic no
mercado contribui bastante para o
crescimento do ASP. Como a quan-
tidade de programadores VB é gran-
de, fica mais fácil para as empresas
contratarem profissionais que de-
senvolvam aplicações em VBScript.
Aderir ao ASP significa quase
sempre optar pelo mundo Win-
dows, uma vez que as páginas ASP
só rodam nativamente em servi-
dores Windows com servidor web
IIS (Internet Information Server),
da Microsoft. É possível rodar pá-
ginas ASP em sistemas Unix por
intermédio de soluções comerciais,
como o ChiliASP, ou usando o Ope-
nASP, no servidor web Apache. Mas
a implementação desse tipo de so-
lução costuma ser problemática
para os webmasters.
PERL, A VETERANA
A linguagem Perl
(Practical Extrac-
tion and Repor-
ting Language) é a
mais antiga das pla-
taformas para desenvolvimento de
sites dinâmicos. Foi criada em 1987
pelo programador Larry Wall para
resolver tarefas de administração
em sistemas Unix. Wall divulgou a
primeira versão de Perl nas listas
de discussão da Usenet e logo pro-
gramadores de todos os cantos do
mundo começaram a dar suges-
tões para o aprimoramento da lin-
guagem. Esse esquema de colabo-
ração continua até hoje, e Wall ain-
da chefia o desenvolvimento.
Com o surgimento da web, a lin-
guagem Perl passou a ser utilizada
também para a montagem de sites
dinâmicos. Os scripts Perl normal-
mente têm a extensão .pl e são inter-
pretados por um programa antes de
ser executados. Um programa cha-
mado de interpretador deve estar ins-
talado no servidor web em que os
scripts são rodados. Há interpretado-
res para Windows e Mac OS. Unix e
Linux interpretam os scripts na ins-
talação-padrão.
Uma das grandes vantagens de
Perl é a portabilidade. Os scripts
podem ser transferidos do Unix
para o Windows e vice-versa com
pouca ou nenhuma modificação.
A linguagem é expandida pelo uso
de módulos, programas criados
para uma função específica, que
podem ser acrescentados aos
scripts feitos em Perl.

Qual das linguagens é a melhor?

ASP ColdFusion JSP Perl PHP
> SISTEMAS Windows(1) Windows, Linux, Unix Windows, Linux, Unix Windows, Linux, Unix, Windows, Linux, Unix
OPERACIONAIS Mac OS
> SERVIDORES PWS, IIS Apache, IIS, Sun One, Apache, Sun One, Apache, IIS Apache, IIS
Netscape Netscape
> BANCOS DE DADOS Access, SQL Server, Access, SQL Server, Oracle, DB2, Sybase, Access, MySQL, Oracle, Access, MySQL, Oracle,
Oracle, DB2, Informix Oracle, DB2, Sybase, Informix DB2, Sybase, Informix DB2, Sybase, Informix
Informix
PRÓS • Grande base instalada • Sintaxe simples, bem • Portabilidade • Gratuito • Gratuito
no mercado parecida com HTML • Todos os recursos da • Expansível por meio de • Sintaxe simples
• Fácil aprendizado • Integração com linguagem Java módulos
produtos Macromedia
CONTRAS • Só roda nativamente no • Base instalada pequena • Exige conhecimento de • Sintaxe complexa • Não há suporte oficial,
mundo Windows • Custo adicional com Java • Não há suporte oficial, mas uma comunidade
servidor mas uma comunidade atuante presta ajuda
atuante presta ajuda
(1) Funciona em outras plataformas, com aplicativos auxiliares

8 < COLEÇÃO INFO COLEÇÃO INFO > 9

FERRAMENTAS/LINGUAGEM 1 23.05.05 16:23 Page 8

FERRAMENTAS/LINGUAGENS FERRAMENTAS/LINGUAGENS

ASP, A OPÇÃO
WINDOWS
O ASP (Active
Server Pages) é
a plataforma da
Microsoft para a criação de sites di-
nâmicos. Em vez de utilizar o mé-
todo CGI (Common Gateway Inter-
face), as páginas ASP consultam o
banco de dados por meio do Isapi
(Internet Server Application Pro-
gramming Interface), que aprimo-
ra a comunicação entre o servidor
e o aplicativo externo.
Quando utilizamos o CGI, cada
pedido de página abre um novo
processo no servidor, o que pode
comprometer o desempenho do si-
te. Já com o Isapi, o processamen-
to de todos os pedidos ao servidor
fica a cargo de um único arquivo
.dll, que, uma vez carregado na me-
mória, permanece lá até que seja
deliberadamente retirado.
O funcionamento de páginas ASP
depende do arquivo asp.dll. É ele
que trata todos os pedidos de exe-
cução das páginas ASP. É importan-
te lembrar que o ASP não é exata-
mente uma linguagem de progra-
mação, mas o que a Microsoft de-
fine como “ambiente de execução
de scripts”. Na maior parte das ve-
zes, as instruções são escritas em
VBScript, que é derivado do Visual
Basic, também filhote da Microsoft.
A penetração do Visual Basic no
mercado contribui bastante para o
crescimento do ASP. Como a quan-
tidade de programadores VB é gran-
de, fica mais fácil para as empresas
contratarem profissionais que de-
senvolvam aplicações em VBScript.
Aderir ao ASP significa quase
sempre optar pelo mundo Win-
dows, uma vez que as páginas ASP
só rodam nativamente em servi-
dores Windows com servidor web
IIS (Internet Information Server),
da Microsoft. É possível rodar pá-
ginas ASP em sistemas Unix por
intermédio de soluções comerciais,
como o ChiliASP, ou usando o Ope-
nASP, no servidor web Apache. Mas
a implementação desse tipo de so-
lução costuma ser problemática
para os webmasters.
PERL, A VETERANA
A linguagem Perl
(Practical Extrac-
tion and Repor-
ting Language) é a
mais antiga das pla-
taformas para desenvolvimento de
sites dinâmicos. Foi criada em 1987
pelo programador Larry Wall para
resolver tarefas de administração
em sistemas Unix. Wall divulgou a
primeira versão de Perl nas listas
de discussão da Usenet e logo pro-
gramadores de todos os cantos do
mundo começaram a dar suges-
tões para o aprimoramento da lin-
guagem. Esse esquema de colabo-
ração continua até hoje, e Wall ain-
da chefia o desenvolvimento.
Com o surgimento da web, a lin-
guagem Perl passou a ser utilizada
também para a montagem de sites
dinâmicos. Os scripts Perl normal-
mente têm a extensão .pl e são inter-
pretados por um programa antes de
ser executados. Um programa cha-
mado de interpretador deve estar ins-
talado no servidor web em que os
scripts são rodados. Há interpretado-
res para Windows e Mac OS. Unix e
Linux interpretam os scripts na ins-
talação-padrão.
Uma das grandes vantagens de
Perl é a portabilidade. Os scripts
podem ser transferidos do Unix
para o Windows e vice-versa com
pouca ou nenhuma modificação.
A linguagem é expandida pelo uso
de módulos, programas criados
para uma função específica, que
podem ser acrescentados aos
scripts feitos em Perl.

Qual das linguagens é a melhor?

ASP ColdFusion JSP Perl PHP
> SISTEMAS Windows(1) Windows, Linux, Unix Windows, Linux, Unix Windows, Linux, Unix, Windows, Linux, Unix
OPERACIONAIS Mac OS
> SERVIDORES PWS, IIS Apache, IIS, Sun One, Apache, Sun One, Apache, IIS Apache, IIS
Netscape Netscape
> BANCOS DE DADOS Access, SQL Server, Access, SQL Server, Oracle, DB2, Sybase, Access, MySQL, Oracle, Access, MySQL, Oracle,
Oracle, DB2, Informix Oracle, DB2, Sybase, Informix DB2, Sybase, Informix DB2, Sybase, Informix
Informix
PRÓS • Grande base instalada • Sintaxe simples, bem • Portabilidade • Gratuito • Gratuito
no mercado parecida com HTML • Todos os recursos da • Expansível por meio de • Sintaxe simples
• Fácil aprendizado • Integração com linguagem Java módulos
produtos Macromedia
CONTRAS • Só roda nativamente no • Base instalada pequena • Exige conhecimento de • Sintaxe complexa • Não há suporte oficial,
mundo Windows • Custo adicional com Java • Não há suporte oficial, mas uma comunidade
servidor mas uma comunidade atuante presta ajuda
atuante presta ajuda
(1) Funciona em outras plataformas, com aplicativos auxiliares

8 < COLEÇÃO INFO COLEÇÃO INFO > 9

FERRAMENTAS/LINGUAGEM 1 23.05.05
FERRAMENTAS/LINGUAGENS
O módulo CGI.pm é um dos mais
conhecidos e facilita a captura de da-
dos em formulários HTML. Todos os
módulos são gratuitos. Existem em-
presas que oferecem suporte comer-
cial para Perl, mas normalmente a
maior ajuda vem dos participantes
das listas de discussão especializa-
das. Para experimentar a linguagem,
faça o download da distribuição Ac-
tivePerl em www.info.abril.com.br/
download/ 3165.shtml.
CONSULTA É COM A SQL
Os programadores podem
escolher a linguagem que
quiserem para construir
aplicativos que automatizem
os sites. Mas não têm muito
como escapar da SQL
(Structured Query Language)
na consulta ao banco de
dados. Se o TCP/IP é o idioma
da internet, podemos dizer
que a SQL tem a mesma
função nos bancos de dados.
A linguagem foi desenvolvida
na década de 60 pela IBM
com uma única finalidade:
manipulação de bancos
de dados. Ela é adotada
por todos os sistemas mais
utilizados no mercado,
como Oracle, Sybase, Informix,
Access e, claro, Microsoft
SQL Server.
No nível mais avançado,
um programador precisa se
10 < C O L E Ç Ã O I N F O
16:23 Page 10
PHP, A
POPULAR
Uma solução
bastante popu-
lar entre os webmasters de sites di-
nâmicos é o PHP (Personal Home
Page). Criado pelo programador Ras-
mus Leedorf, está na recém-lança-
da versão 5 (veja teste na página 14).
Mas, por algumas questões de com-
patibilidade, a versão 4.3.11 ainda é
a mais usada. A linguagem funcio-
dedicar muito para dominar
a SQL, mesmo porque diversos
bancos de dados possuem
extensões proprietárias, funções
mais avançadas que só
funcionam naquele sistema.
Os comandos básicos, porém,
são intuitivos e podem ser
usados sem dificuldade por
quem tem noção de
programação. Veja alguns:
CREATE: cria tabelas
SELECT: seleciona dados
INSERT: inclui dados em tabelas
UPDATE: atualiza dados
DELETE: apaga dados
Além dos comandos principais,
outras expressões muito usadas
são o “where”, que inclui a
condição, e o “order by”, que
ordena o resultado da consulta
SQL. Veja o exemplo a seguir:
na tanto em Unix quanto em Win-
dows e possui suporte para diver-
sos bancos de dados, incluindo
MySQL, Sybase, SQL e Oracle.
A sintaxe possui alguns elemen-
tos derivados do Perl, mas é bem -
mais simples e exige apenas noções
básicas de programação. Além dis-
so, há outra qualidade muito impor-
tante, que beneficia uma parte sen-
sível de todos nós: o bolso. O inter-
pretador PHP (programa que pro-
“SELECT nome,endereco FROM
clientes WHERE estado = ‘sp’
ORDER BY nome”
Esse comando seleciona as colunas
“nome” e “endereco” da tabela
“clientes” em que o estado é igual
a “sp” (condição imposta pela
expressão “where”). Portanto,
somente os clientes de São Paulo.
Os resultados são ordenados por
“nome”. A tabela poderia conter
outras colunas, como “idade” e
“sexo”, mas nesse exemplo
usamos só “nome” e “endereco”.
Para selecionar todas as colunas,
basta trocar “nome,endereco”
por *, como abaixo:
“SELECT * FROM clientes WHERE
estado = ‘sp’ ORDER BY nome”
A seguir, temos exemplos de
consultas SQL já inseridas em
códigos ASP e ColdFusion.
FERRAMENTAS/LINGUAGENS
cessa as páginas feitas nesse for-
mato) é gratuito, e basta baixar e
instalar no servidor para começar
a criar seu website dinâmico.
Desde o início, o PHP foi desen-
volvido como um padrão totalmen-
te aberto, em que programadores
de todo o mundo colaboram para
o aprimoramento da linguagem, do
mesmo modo como ocorre com o
Linux. Apesar do crescimento de
seus concorrentes endinheirados,
ASP
<%
set conn =
server.createobject(“adodb.
connection”)
conn.open “bancodedados”
set rsquery =
conn.execute(“select
nome,telefone from
tabelabanco”)
while not rsquery.eof
response.write
rsquery(“nome”)& “ - “ &
rsquery(“telefone”)& “ <br>”
rsquery.movenext
wend
%>
ColdFusion
<CFQUERY NAME= “consulta”
DATASOURCE=
“bancodedados”>
select * from tabelabanco
</CFQUERY>
C O L E Ç Ã O I N F O > 11
FERRAMENTAS/LINGUAGEM 1 23.05.05
FERRAMENTAS/LINGUAGENS
O módulo CGI.pm é um dos mais
conhecidos e facilita a captura de da-
dos em formulários HTML. Todos os
módulos são gratuitos. Existem em-
presas que oferecem suporte comer-
cial para Perl, mas normalmente a
maior ajuda vem dos participantes
das listas de discussão especializa-
das. Para experimentar a linguagem,
faça o download da distribuição Ac-
tivePerl em www.info.abril.com.br/
download/ 3165.shtml.
CONSULTA É COM A SQL
Os programadores podem
escolher a linguagem que
quiserem para construir
aplicativos que automatizem
os sites. Mas não têm muito
como escapar da SQL
(Structured Query Language)
na consulta ao banco de
dados. Se o TCP/IP é o idioma
da internet, podemos dizer
que a SQL tem a mesma
função nos bancos de dados.
A linguagem foi desenvolvida
na década de 60 pela IBM
com uma única finalidade:
manipulação de bancos
de dados. Ela é adotada
por todos os sistemas mais
utilizados no mercado,
como Oracle, Sybase, Informix,
Access e, claro, Microsoft
SQL Server.
No nível mais avançado,
um programador precisa se
10 < C O L E Ç Ã O I N F O
16:23 Page 10
PHP, A
POPULAR
Uma solução
bastante popu-
lar entre os webmasters de sites di-
nâmicos é o PHP (Personal Home
Page). Criado pelo programador Ras-
mus Leedorf, está na recém-lança-
da versão 5 (veja teste na página 14).
Mas, por algumas questões de com-
patibilidade, a versão 4.3.11 ainda é
a mais usada. A linguagem funcio-
dedicar muito para dominar
a SQL, mesmo porque diversos
bancos de dados possuem
extensões proprietárias, funções
mais avançadas que só
funcionam naquele sistema.
Os comandos básicos, porém,
são intuitivos e podem ser
usados sem dificuldade por
quem tem noção de
programação. Veja alguns:
CREATE: cria tabelas
SELECT: seleciona dados
INSERT: inclui dados em tabelas
UPDATE: atualiza dados
DELETE: apaga dados
Além dos comandos principais,
outras expressões muito usadas
são o “where”, que inclui a
condição, e o “order by”, que
ordena o resultado da consulta
SQL. Veja o exemplo a seguir:
na tanto em Unix quanto em Win-
dows e possui suporte para diver-
sos bancos de dados, incluindo
MySQL, Sybase, SQL e Oracle.
A sintaxe possui alguns elemen-
tos derivados do Perl, mas é bem -
mais simples e exige apenas noções
básicas de programação. Além dis-
so, há outra qualidade muito impor-
tante, que beneficia uma parte sen-
sível de todos nós: o bolso. O inter-
pretador PHP (programa que pro-
“SELECT nome,endereco FROM
clientes WHERE estado = ‘sp’
ORDER BY nome”
Esse comando seleciona as colunas
“nome” e “endereco” da tabela
“clientes” em que o estado é igual
a “sp” (condição imposta pela
expressão “where”). Portanto,
somente os clientes de São Paulo.
Os resultados são ordenados por
“nome”. A tabela poderia conter
outras colunas, como “idade” e
“sexo”, mas nesse exemplo
usamos só “nome” e “endereco”.
Para selecionar todas as colunas,
basta trocar “nome,endereco”
por *, como abaixo:
“SELECT * FROM clientes WHERE
estado = ‘sp’ ORDER BY nome”
A seguir, temos exemplos de
consultas SQL já inseridas em
códigos ASP e ColdFusion.
FERRAMENTAS/LINGUAGENS
cessa as páginas feitas nesse for-
mato) é gratuito, e basta baixar e
instalar no servidor para começar
a criar seu website dinâmico.
Desde o início, o PHP foi desen-
volvido como um padrão totalmen-
te aberto, em que programadores
de todo o mundo colaboram para
o aprimoramento da linguagem, do
mesmo modo como ocorre com o
Linux. Apesar do crescimento de
seus concorrentes endinheirados,
ASP
<%
set conn =
server.createobject(“adodb.
connection”)
conn.open “bancodedados”
set rsquery =
conn.execute(“select
nome,telefone from
tabelabanco”)
while not rsquery.eof
response.write
rsquery(“nome”)& “ - “ &
rsquery(“telefone”)& “ <br>”
rsquery.movenext
wend
%>
ColdFusion
<CFQUERY NAME= “consulta”
DATASOURCE=
“bancodedados”>
select * from tabelabanco
</CFQUERY>
C O L E Ç Ã O I N F O > 11
FERRAMENTAS/LINGUAGEM 1 23.05.05
FERRAMENTAS/LINGUAGENS
como o ASP e o ColdFusion, o PHP
ainda se mantém entre as soluções
mais utilizadas na construção de
websites dinâmicos. O download
do código fonte e dos arquivos
para Windows pode ser feito em
www.info.abril.com.br/download/
3203.shtml.
JSP, A ECLÉTICA
A JSP (Java Server
Pages) é a alterna-
tiva de programa-
ção de sites dinâmi-
cos elaborada pela
Sun, criadora do Ja-
va. Como dá para desconfiar, o co-
nhecimento de Java é pré-requisi-
to para o desenvolvimento em JSP,
o que de cara afasta muita gente.
A linguagem Java é robusta e tem
funções extremamente mais com-
plexas do que o desenvolvimento
web. Dessa forma, aprender Java
apenas para criar páginas em JSP
pode ser um exagero, já que exis-
tem opções mais simples.
A JSP conta com todas as vanta-
gens da linguagem Java e a princi-
pal delas é a portabilidade. As pá-
ginas JSP rodam tanto em máqui-
nas Unix como em Windows com
pouquíssimas modificações. Uma
das características da linguagem é
a possibilidade de criar “bibliote-
cas de comandos”. Com isso, blo-
cos de comandos podem ser arma-
zenados e inseridos nas páginas
quando necessário. As páginas JSP
são armazenadas num servlet Ja-
12 < C O L E Ç Ã O I N F O
16:24 Page 12
va, ou seja, compiladas num pe-
queno programa. Esse servlet é ge-
rado na primeira vez em que a pá-
gina é requisitada e depois fica per-
manentemente disponível no ser-
vidor. As páginas JSP podem ser
criadas em sintaxe compatível com
o XML, o que facilita a distribuição.
COLDFUSION,
A CARA DO XML
A tecnologia ColdFu-
sion foi desenvolvi-
da pela Allaire, pro-
dutora do conhecido
editor HTML Home-
Site e de outros softwares para de-
senvolvimento web. No início de
2001, a Allaire foi comprada pela Ma-
cromedia, dona da tecnologia Flash
e do editor Dreamweaver. A Macro-
media tratou de aumentar a integra-
ção do ColdFusion com seus produ-
tos e aprimorar a tecnologia, reba-
tizada de ColdFusion MX (veja o tes-
te da versão MX 7 na página 16).
Essa plataforma utiliza uma lin-
guagem própria, a CFML (ColdFusion
Markup Language), para criar os tem-
plates e recursos dinâmicos. As pá-
ginas podem ser reconhecidas pela
extensão .cfm. A linguagem CFML é
bastante parecida com o HTML e o
XML. Para que o ColdFusion funcio-
ne, é necessário um aplicativo exter-
no, que processará o código CFML.
Esse aplicativo é o ColdFusion MX
Server, que roda em conjunto com
o servidor web. Ele recebe as pági-
nas .cfm, executa o código (fazendo
as devidas consultas ao banco de da-
dos) e devolve a página formatada.
Uma grande desvantagem do
ColdFusion é o custo. Enquanto a
implementação de Perl, PHP e ASP
é gratuita (no caso do ASP, desde
que o site funcione na plataforma
Windows e IIS), um servidor Cold-
Fusion custa perto de 15 000
reais, o que de cara desanima mui-
ta gente. Mas se você quiser ex-
perimentar, há uma versão do
ColdFusion MX 7 Enterprise para
teste por 30 dias disponível para
download (www.info.abril.com.
br/download/2152.shtml), além
da versão Developer, gratuita, com
funções apenas para desenvolvi-
mento de aplicações.
ASP.NET, A INTEGRADORA
A arquitetura ASP.Net promete ex-
pandir os recursos do ASP e atrair
desenvolvedores de outras lingua-
gens. Faz parte da estratégia .Net, da
Microsoft, cujo objetivo é integrar as
ferramentas de produção e distribui-
ção de serviços pela internet.
Uma das principais característi-
cas da plataforma é permitir o de-
senvolvimento em várias lingua-
gens. Seguindo uma série de pro-
cedimentos, pode-se escrever, por
exemplo, um programa em Perl
para ASP.Net. Outros ambientes
suportados são o Visual Basic, o
Python, o C#, e o Visual C++. A au-
FERRAMENTAS/LINGUAGENS
sência mais notada é a linguagem
Java, mas isso não chega a ser uma
grande surpresa. Microsoft e Sun
travam uma batalha ferrenha e
ninguém esperava que a empre-
sa de Bill Gates apoiasse a rival.
J2EE, A
SUPERMÁQUINA
A tecnologia J2EE
(Java 2 Enterprise
Edition) tem pontos
em comum com a
.NET, da Microsoft.
Ambas fornecem ar-
quitetura de componentes para a
construção de sistemas distribuí-
dos, oferecendo recursos similares
para o desenvolvimento de aplica-
ções para internet e web services.
Os componentes Enterprise Ja-
vaBeans permitem o acesso auto-
mático a objetos no banco de da-
dos. A tecnologia utiliza o concei-
to de máquina virtual, no qual as
linguagens de programação são
compiladas num código interme-
diário, chamado bytecode.
A Máquina Virtual Java é utiliza-
da para mapear uma mesma lin-
guagem nas mais diversas plata-
formas. Essa característica permi-
te que uma aplicação corporativa
feita para sistema operacional Win-
dows possa rodar sem alterações
em Unix ou até em mainframes.
Para a integração com outros sis-
temas, o J2EE oferece suporte ao
padrão Corba e outras facilidades,
como os Java Connectors.
C O L E Ç Ã O I N F O > 13
FERRAMENTAS/LINGUAGEM 1 23.05.05
FERRAMENTAS/LINGUAGENS
como o ASP e o ColdFusion, o PHP
ainda se mantém entre as soluções
mais utilizadas na construção de
websites dinâmicos. O download
do código fonte e dos arquivos
para Windows pode ser feito em
www.info.abril.com.br/download/
3203.shtml.
JSP, A ECLÉTICA
A JSP (Java Server
Pages) é a alterna-
tiva de programa-
ção de sites dinâmi-
cos elaborada pela
Sun, criadora do Ja-
va. Como dá para desconfiar, o co-
nhecimento de Java é pré-requisi-
to para o desenvolvimento em JSP,
o que de cara afasta muita gente.
A linguagem Java é robusta e tem
funções extremamente mais com-
plexas do que o desenvolvimento
web. Dessa forma, aprender Java
apenas para criar páginas em JSP
pode ser um exagero, já que exis-
tem opções mais simples.
A JSP conta com todas as vanta-
gens da linguagem Java e a princi-
pal delas é a portabilidade. As pá-
ginas JSP rodam tanto em máqui-
nas Unix como em Windows com
pouquíssimas modificações. Uma
das características da linguagem é
a possibilidade de criar “bibliote-
cas de comandos”. Com isso, blo-
cos de comandos podem ser arma-
zenados e inseridos nas páginas
quando necessário. As páginas JSP
são armazenadas num servlet Ja-
12 < C O L E Ç Ã O I N F O
16:24 Page 12
va, ou seja, compiladas num pe-
queno programa. Esse servlet é ge-
rado na primeira vez em que a pá-
gina é requisitada e depois fica per-
manentemente disponível no ser-
vidor. As páginas JSP podem ser
criadas em sintaxe compatível com
o XML, o que facilita a distribuição.
COLDFUSION,
A CARA DO XML
A tecnologia ColdFu-
sion foi desenvolvi-
da pela Allaire, pro-
dutora do conhecido
editor HTML Home-
Site e de outros softwares para de-
senvolvimento web. No início de
2001, a Allaire foi comprada pela Ma-
cromedia, dona da tecnologia Flash
e do editor Dreamweaver. A Macro-
media tratou de aumentar a integra-
ção do ColdFusion com seus produ-
tos e aprimorar a tecnologia, reba-
tizada de ColdFusion MX (veja o tes-
te da versão MX 7 na página 16).
Essa plataforma utiliza uma lin-
guagem própria, a CFML (ColdFusion
Markup Language), para criar os tem-
plates e recursos dinâmicos. As pá-
ginas podem ser reconhecidas pela
extensão .cfm. A linguagem CFML é
bastante parecida com o HTML e o
XML. Para que o ColdFusion funcio-
ne, é necessário um aplicativo exter-
no, que processará o código CFML.
Esse aplicativo é o ColdFusion MX
Server, que roda em conjunto com
o servidor web. Ele recebe as pági-
nas .cfm, executa o código (fazendo
as devidas consultas ao banco de da-
dos) e devolve a página formatada.
Uma grande desvantagem do
ColdFusion é o custo. Enquanto a
implementação de Perl, PHP e ASP
é gratuita (no caso do ASP, desde
que o site funcione na plataforma
Windows e IIS), um servidor Cold-
Fusion custa perto de 15 000
reais, o que de cara desanima mui-
ta gente. Mas se você quiser ex-
perimentar, há uma versão do
ColdFusion MX 7 Enterprise para
teste por 30 dias disponível para
download (www.info.abril.com.
br/download/2152.shtml), além
da versão Developer, gratuita, com
funções apenas para desenvolvi-
mento de aplicações.
ASP.NET, A INTEGRADORA
A arquitetura ASP.Net promete ex-
pandir os recursos do ASP e atrair
desenvolvedores de outras lingua-
gens. Faz parte da estratégia .Net, da
Microsoft, cujo objetivo é integrar as
ferramentas de produção e distribui-
ção de serviços pela internet.
Uma das principais característi-
cas da plataforma é permitir o de-
senvolvimento em várias lingua-
gens. Seguindo uma série de pro-
cedimentos, pode-se escrever, por
exemplo, um programa em Perl
para ASP.Net. Outros ambientes
suportados são o Visual Basic, o
Python, o C#, e o Visual C++. A au-
FERRAMENTAS/LINGUAGENS
sência mais notada é a linguagem
Java, mas isso não chega a ser uma
grande surpresa. Microsoft e Sun
travam uma batalha ferrenha e
ninguém esperava que a empre-
sa de Bill Gates apoiasse a rival.
J2EE, A
SUPERMÁQUINA
A tecnologia J2EE
(Java 2 Enterprise
Edition) tem pontos
em comum com a
.NET, da Microsoft.
Ambas fornecem ar-
quitetura de componentes para a
construção de sistemas distribuí-
dos, oferecendo recursos similares
para o desenvolvimento de aplica-
ções para internet e web services.
Os componentes Enterprise Ja-
vaBeans permitem o acesso auto-
mático a objetos no banco de da-
dos. A tecnologia utiliza o concei-
to de máquina virtual, no qual as
linguagens de programação são
compiladas num código interme-
diário, chamado bytecode.
A Máquina Virtual Java é utiliza-
da para mapear uma mesma lin-
guagem nas mais diversas plata-
formas. Essa característica permi-
te que uma aplicação corporativa
feita para sistema operacional Win-
dows possa rodar sem alterações
em Unix ou até em mainframes.
Para a integração com outros sis-
temas, o J2EE oferece suporte ao
padrão Corba e outras facilidades,
como os Java Connectors.
C O L E Ç Ã O I N F O > 13
FERRAMENTAS/ PHP 23.05.05 16:26
FERRAMENTAS/PHP
O XML DESLIZA
NO PHP 5
A LINGUAGEM DÁ UM SALTO DE QUALIDADE E FACILITA
A VIDA DO PROGRAMADOR
POR ANDRÉ CARDOZO
popular linguagem PHP
A chegou à versão 5 com-
pletamente repaginada.
Programadores adeptos
do código-fonte aberto refizeram
grande parte do código da versão
anterior, a 4.3, introduzindo avan-
ços significativos no suporte a XML,
orientação a objetos e a banco de
dados MySQL. INFO foi conferir. No
teste, utilizamos um micro Dell com
processador Pentium 4 de 2,4 GHz,
256 MB de RAM, disco de 40 GB e
PHP 5: avanços no suporte a XML, orientação a objetos e a banco de dados MySQL
14 < C O L E Ç Ã O I N F O
Page 14
sistema Windows XP Professional. O
servidor web usado foi o IIS 5.1.
O banco de dados MySQL é par-
ceiro fiel do PHP na maioria dos si-
tes dinâmicos. Mas muitas das novi-
dades apresentadas no MySQL 4.1 e
no beta do 5.0 não eram suportadas
adequadamente pelo PHP 4.3. Por
isso, a extensão MySQL do PHP 5 foi
totalmente reformulada. Batizada de
MySQLi (MySQL Improved), a nova
extensão traz como principal novi-
dade o recurso de orientação a ob-
FERRAMENTAS/PHP
jetos aplicado ao MySQL, atribuindo
métodos e propriedades a compo-
nentes do banco de dados.
libxml2, desenvolvida pelos pro-
gramadores do projeto Gnome. Es-
sa biblioteca implementa de uma
Outra boa novidade para quem
lida com armazenamento de infor-
mação é a SQLi-
só vez diversas funcionalidades re-
lacionadas ao XML, todas de acor-
do com os pa-
te. Essa bibliote- DOM drões estabeleci-
ca funciona co- dos pelo W3C.
Sigla de Document Object Model.
mo um banco de Padrão para manipulação de Uma nova ex-
dados e já vem objetos em páginas web baseadas tensão que facili-
embutida no PHP em HTML ou XML ta o acesso e a
5. Assim, no caso
de aplicações mais simples, os pro-
gramadores podem usar a SQLite
manipulação dos
arquivos XML é a SimpleXML. Com
ela, o programador trabalha com
em vez de instalar um banco de da- documentos XML como se fossem
dos completo. objetos nativos do PHP, evitando a
O XML foi outro ponto debulha- utilização do padrão DOM, bem mais
do pela equipe do PHP 5 na cria- complexo. A extensão referente ao
ção do novo código. Agora, todas método DOM foi completamente
as extensões referentes à lingua- reescrita, também de acordo com
gem são baseadas na biblioteca as especificações do consórcio W3C.
PHP 5
> FABRICANTE PHP Group
> O QUE É Linguagem para produção de sites dinâmicos
> PRÓ Mais suporte a orientação de objetos
> CONTRA Alguns scripts antigos precisam ser reescritos
> COMPATIBILIDADE 7,5
Biblioteca libxml2 obedece aos padrões do W3C
> XML 7,5
Extensão SimpleXML facilita o acesso a
documentos do padrão
> MYSQL 8,0
Nova extensão suporta funcionalidades das
versões 4.1 e 5 do banco de dados
> AVALIAÇÃO FINAL(1) 7,6
> PREÇO Grátis
> CUSTO/BENEFÍCIO
> ONDE ENCONTRAR www.info.abril.com.br/download/3203.shtml
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Compatibilidade (40%),
XML (30%) e MySQL (30%).
C O L E Ç Ã O I N F O > 15
FERRAMENTAS/ PHP 23.05.05 16:26
FERRAMENTAS/PHP
O XML DESLIZA
NO PHP 5
A LINGUAGEM DÁ UM SALTO DE QUALIDADE E FACILITA
A VIDA DO PROGRAMADOR
POR ANDRÉ CARDOZO
popular linguagem PHP
A chegou à versão 5 com-
pletamente repaginada.
Programadores adeptos
do código-fonte aberto refizeram
grande parte do código da versão
anterior, a 4.3, introduzindo avan-
ços significativos no suporte a XML,
orientação a objetos e a banco de
dados MySQL. INFO foi conferir. No
teste, utilizamos um micro Dell com
processador Pentium 4 de 2,4 GHz,
256 MB de RAM, disco de 40 GB e
PHP 5: avanços no suporte a XML, orientação a objetos e a banco de dados MySQL
14 < C O L E Ç Ã O I N F O
Page 14
sistema Windows XP Professional. O
servidor web usado foi o IIS 5.1.
O banco de dados MySQL é par-
ceiro fiel do PHP na maioria dos si-
tes dinâmicos. Mas muitas das novi-
dades apresentadas no MySQL 4.1 e
no beta do 5.0 não eram suportadas
adequadamente pelo PHP 4.3. Por
isso, a extensão MySQL do PHP 5 foi
totalmente reformulada. Batizada de
MySQLi (MySQL Improved), a nova
extensão traz como principal novi-
dade o recurso de orientação a ob-
FERRAMENTAS/PHP
jetos aplicado ao MySQL, atribuindo
métodos e propriedades a compo-
nentes do banco de dados.
libxml2, desenvolvida pelos pro-
gramadores do projeto Gnome. Es-
sa biblioteca implementa de uma
Outra boa novidade para quem
lida com armazenamento de infor-
mação é a SQLi-
só vez diversas funcionalidades re-
lacionadas ao XML, todas de acor-
do com os pa-
te. Essa bibliote- DOM drões estabeleci-
ca funciona co- dos pelo W3C.
Sigla de Document Object Model.
mo um banco de Padrão para manipulação de Uma nova ex-
dados e já vem objetos em páginas web baseadas tensão que facili-
embutida no PHP em HTML ou XML ta o acesso e a
5. Assim, no caso
de aplicações mais simples, os pro-
gramadores podem usar a SQLite
manipulação dos
arquivos XML é a SimpleXML. Com
ela, o programador trabalha com
em vez de instalar um banco de da- documentos XML como se fossem
dos completo. objetos nativos do PHP, evitando a
O XML foi outro ponto debulha- utilização do padrão DOM, bem mais
do pela equipe do PHP 5 na cria- complexo. A extensão referente ao
ção do novo código. Agora, todas método DOM foi completamente
as extensões referentes à lingua- reescrita, também de acordo com
gem são baseadas na biblioteca as especificações do consórcio W3C.
PHP 5
> FABRICANTE PHP Group
> O QUE É Linguagem para produção de sites dinâmicos
> PRÓ Mais suporte a orientação de objetos
> CONTRA Alguns scripts antigos precisam ser reescritos
> COMPATIBILIDADE 7,5
Biblioteca libxml2 obedece aos padrões do W3C
> XML 7,5
Extensão SimpleXML facilita o acesso a
documentos do padrão
> MYSQL 8,0
Nova extensão suporta funcionalidades das
versões 4.1 e 5 do banco de dados
> AVALIAÇÃO FINAL(1) 7,6
> PREÇO Grátis
> CUSTO/BENEFÍCIO
> ONDE ENCONTRAR www.info.abril.com.br/download/3203.shtml
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Compatibilidade (40%),
XML (30%) e MySQL (30%).
C O L E Ç Ã O I N F O > 15
FERRAMENTAS/COLDFUSION 23.05.05
FERRAMENTAS/COLDFUSION
GANHE TEMPO
COM O
COLDFUSION
A VERSÃO MX 7 DO SERVIDOR DE APLICAÇÕES GANHOU
FUNÇÕES QUE AGILIZAM O DESENVOLVIMENTO
POR MAURÍCIO GREGO
criação de relatórios,
A formulários e outros
componentes comuns
de um site costuma to-
mar mais tempo do que o desen-
volvedor de aplicações gostaria.
Atenta à questão da produtivida-
de, a Macromedia procurou facili-
tar essas tarefas freqüentes no Cold-
Fusion MX 7, a versão mais recen-
te de seu veterano servidor de apli-
cações. Além disso, o software agre-
gou novos recursos que permitem
que os aplicativos se co-
muniquem por SMS e
mensagens instantâneas.
Na análise feita pelo
INFOLAB, a nova versão
não revela nenhuma re-
forma radical como foi a
passagem do ColdFusion
5 para o MX (6), em 2002.
Mas traz acréscimos
bem-vindos num mo-
mento em que produti-
vidade é uma meta oni-
presente nas empresas. Gateways: permitem comunicação por e-mail e SMS
16 < C O L E Ç Ã O I N F O
16:28 Page 16
Quando a Allaire criou o ColdFu-
sion, em 1995, seu objetivo era ter
uma maneira prática de fazer as pá-
ginas da web trocarem informações com
os bancos de dados. Depois que a
Allaire foi comprada pela Macrome-
dia, o ColdFusion evoluiu para uma
plataforma completa com linguagem
de script, comunicação com bancos
de dados, funções para a implemen-
tação de serviços web, suporte pa-
ra conteúdo multimídia e recursos
de segurança. Desde a versão MX, o
servidor de aplicações,
em si, pode até ser outro.
Os aplicativos em ColdFu-
sion são convertidos pa-
ra bytecode Java e podem
rodar em servidores de
outras empresas.
O INFOLAB analisou o
ColdFusion MX 7 Enter-
prise, a edição mais com-
pleta. Melhorou a cria-
ção de formulários, usa- Relatórios: o Report Builder define o layout
dos nos sites para dispa-
rar buscas, fazer compras e cadas-
trar dados, por exemplo. O desen-
volvedor pode produzir formulários
em HTML, CSS e JavaScript usando
os comandos habituais da CFML, a
linguagem de script do ColdFusion.
Mas agora é possível gerar formu-
lários em Flash de maneira muito
simples. Basta acrescentar um pa-
râmetro (format=”flash”) ao coman-
do que inicia o formulário. E a for-
matação pode ser feita com a apli-
cação de “peles” baseadas em CSS.
> RELATÓRIOS MAIS SIMPLES
Os relatórios ficaram mais fáceis de
ser desenvolvidos no ColdFusion MX
7. Eles são outro componente básico
de qualquer site dinâmico. Aparecem
na forma de recibos de transações e
resultados de pesquisas, por exem-
plo. Nas versões anteriores, as opções
de formatação e organização das in-
formações eram limitadas. Agora, o
pacote da Macromedia inclui um pro-
grama específico para a produção de
relatórios, o Report Builder. Nele, fi-
FERRAMENTAS/COLDFUSION
ca mais fácil definir que dados vão
aparecer no relatório e como estarão
organizados. Os relatórios gerados
podem ser embutidos em páginas
HTML e visualizados normalmente no
browser. Também podem ser conver-
tidos para PDF ou para o FlashPaper,
formato próprio da Macromedia. Es-
sa é outra novidade, já que, nas ver-
sões anteriores, a produção de docu-
mentos nesses formatos dependia de
softwares adicionais. Esse recurso po-
de facilitar a produção de versões pa-
ra imprimir documentos.
> GATEWAYS DE EVENTOS
Outro acréscimo são os gateways de
eventos. Eles permitem que os apli-
cativos online se comuniquem por
e-mail, SMS ou mensagens instantâ-
neas. Uma loja online pode, por
exemplo, enviar um SMS ao compra-
dor para avisar que o produto que
ele adquiriu foi despachado para en-
trega. O servidor também pode, ago-
ra, reagir a uma variedade de even-
tos relacionados com o próprio apli-
C O L E Ç Ã O I N F O > 17
FERRAMENTAS/COLDFUSION 23.05.05
FERRAMENTAS/COLDFUSION
GANHE TEMPO
COM O
COLDFUSION
A VERSÃO MX 7 DO SERVIDOR DE APLICAÇÕES GANHOU
FUNÇÕES QUE AGILIZAM O DESENVOLVIMENTO
POR MAURÍCIO GREGO
criação de relatórios,
A formulários e outros
componentes comuns
de um site costuma to-
mar mais tempo do que o desen-
volvedor de aplicações gostaria.
Atenta à questão da produtivida-
de, a Macromedia procurou facili-
tar essas tarefas freqüentes no Cold-
Fusion MX 7, a versão mais recen-
te de seu veterano servidor de apli-
cações. Além disso, o software agre-
gou novos recursos que permitem
que os aplicativos se co-
muniquem por SMS e
mensagens instantâneas.
Na análise feita pelo
INFOLAB, a nova versão
não revela nenhuma re-
forma radical como foi a
passagem do ColdFusion
5 para o MX (6), em 2002.
Mas traz acréscimos
bem-vindos num mo-
mento em que produti-
vidade é uma meta oni-
presente nas empresas. Gateways: permitem comunicação por e-mail e SMS
16 < C O L E Ç Ã O I N F O
16:28 Page 16
Quando a Allaire criou o ColdFu-
sion, em 1995, seu objetivo era ter
uma maneira prática de fazer as pá-
ginas da web trocarem informações com
os bancos de dados. Depois que a
Allaire foi comprada pela Macrome-
dia, o ColdFusion evoluiu para uma
plataforma completa com linguagem
de script, comunicação com bancos
de dados, funções para a implemen-
tação de serviços web, suporte pa-
ra conteúdo multimídia e recursos
de segurança. Desde a versão MX, o
servidor de aplicações,
em si, pode até ser outro.
Os aplicativos em ColdFu-
sion são convertidos pa-
ra bytecode Java e podem
rodar em servidores de
outras empresas.
O INFOLAB analisou o
ColdFusion MX 7 Enter-
prise, a edição mais com-
pleta. Melhorou a cria-
ção de formulários, usa- Relatórios: o Report Builder define o layout
dos nos sites para dispa-
rar buscas, fazer compras e cadas-
trar dados, por exemplo. O desen-
volvedor pode produzir formulários
em HTML, CSS e JavaScript usando
os comandos habituais da CFML, a
linguagem de script do ColdFusion.
Mas agora é possível gerar formu-
lários em Flash de maneira muito
simples. Basta acrescentar um pa-
râmetro (format=”flash”) ao coman-
do que inicia o formulário. E a for-
matação pode ser feita com a apli-
cação de “peles” baseadas em CSS.
> RELATÓRIOS MAIS SIMPLES
Os relatórios ficaram mais fáceis de
ser desenvolvidos no ColdFusion MX
7. Eles são outro componente básico
de qualquer site dinâmico. Aparecem
na forma de recibos de transações e
resultados de pesquisas, por exem-
plo. Nas versões anteriores, as opções
de formatação e organização das in-
formações eram limitadas. Agora, o
pacote da Macromedia inclui um pro-
grama específico para a produção de
relatórios, o Report Builder. Nele, fi-
FERRAMENTAS/COLDFUSION
ca mais fácil definir que dados vão
aparecer no relatório e como estarão
organizados. Os relatórios gerados
podem ser embutidos em páginas
HTML e visualizados normalmente no
browser. Também podem ser conver-
tidos para PDF ou para o FlashPaper,
formato próprio da Macromedia. Es-
sa é outra novidade, já que, nas ver-
sões anteriores, a produção de docu-
mentos nesses formatos dependia de
softwares adicionais. Esse recurso po-
de facilitar a produção de versões pa-
ra imprimir documentos.
> GATEWAYS DE EVENTOS
Outro acréscimo são os gateways de
eventos. Eles permitem que os apli-
cativos online se comuniquem por
e-mail, SMS ou mensagens instantâ-
neas. Uma loja online pode, por
exemplo, enviar um SMS ao compra-
dor para avisar que o produto que
ele adquiriu foi despachado para en-
trega. O servidor também pode, ago-
ra, reagir a uma variedade de even-
tos relacionados com o próprio apli-
C O L E Ç Ã O I N F O > 17
FERRAMENTAS/COLDFUSION 23.05.05 16:28 Page 18

FERRAMENTAS/COLDFUSION

cativo. Consegue, por exemplo, dis- dem combinar o front-end em Cold-

parar uma ação no início ou no fim
de uma sessão ou requisição do
usuário ou quando ocorre uma de-
terminada condição de erro.
O ColdFusion incorporou exten-
sões para o Dreamweaver. Elas per-
mitem realizar tarefas como conec-
tar a base de dados ao servidor sem
sair do ambiente de desenvolvimen-
to. Como já acontecia em versões an-
teriores, o produto não inclui ferra-
mentas de programação. A idéia é
que o desenvolvedor adquira sepa-
radamente o Dreamweaver.
Pode-se notar que o forte do Cold-
Fusion continua sendo o desenvolvi-
mento rápido do front-end, a parte
do aplicativo que interage com o usuá-
rio na web. Empresas que necessitam
de mais robustez e desempenho na
parte que processa as transações po-
Fusion com programas de retaguar-
da implementados na forma de clas-
ses Java ou, no caso do ambiente .Net,
de objetos COM. Esses objetos e clas-
ses são, então, ativados de dentro de
um script do ColdFusion.
Além da edição Enterprise, o Cold-
Fusion MX 7 é oferecido em mais
duas. A edição Standard não inclui
os gateways de eventos e tem limi-
tações de capacidade. É recomen-
dada para sites menores, que ro-
dam num único servidor. Já a edi-
ção Developer é distribuída gratui-
tamente, mas permite acesso ao ser-
vidor apenas na rede local. Quem
quiser experimentar o ColdFusion
MX 7 pode baixar a versão Develo-
per ou um demo da Enterprise no
endereço www.info.abril.com.br/
download/2152.shtml.

ColdFusion MX 7 Enterprise
> FABRICANTE Macromedia
> O QUE É Plataforma para aplicativos na web
> PRÓ Os novos recursos agilizam o desenvolvimento
> CONTRA O pacote não inclui editor de programas
> LINGUAGEM DE 8,8
PROGRAMAÇÃO A linguagem CFML é poderosa e de rápido
aprendizado
> FERRAMENTAS 7,9
Novas funções facilitam a produção de
formulários e relatórios
> COMPATIBILIDADE 8,2
Trabalha com vários servidores de aplicações e
bancos de dados
> AVALIAÇÃO TÉCNICA(1) 8,3
> PREÇOS (R$) 14 877 (completo)
7 438 (atualização)
> CUSTO/BENEFÍCIO 7,0
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Linguagem
de programação (35%), Ferramentas de gerenciamento (35%) e Compatibilidade (30%).

18 < C O L E Ç Ã O I N F O
FERRAMENTAS/MY SQL 1 24.05.05 12:38
DADOS LIVRES
COM O MYSQL
ESTÁVEL, RÁPIDO E FÁCIL DE USAR, ELE É A ESTRELA
DOS BANCOS DE DADOS DE CÓDIGO ABERTO
s bancos de dados open
O source estão cada vez
mais presentes nas em-
presas. Nas pequenas,
com suas aplicações simples e rápi-
das, podem dar conta de todo o tra-
balho. No mundo corporativo, aten-
dem às necessidades de muitos de-
partamentos. O nome mais expres-
sivo desse grupo, que inclui Post-
greSQL e Firebird, é o MySQL, da
© ILUSTRAÇÃO CELLUS
Page 19
FERRAMENTAS/MYSQL
empresa sueca MySQL AB. Rápido,
multiplataforma, gratuito (apenas o
suporte é cobrado) e fácil de usar,
ele já é bastante utilizado na mon-
tagem de sites dinâmicos e começa
a ser empregado em intranets.
Pequeno no tamanho, mas gran-
de nas aplicações que pode rodar,
o MySQL é compatível com o pa-
drão SQL (Ansi) e pode trabalhar
com várias plataformas. Em siste-
C O L E Ç Ã O I N F O > 19
FERRAMENTAS/MY SQL 1 23.05.05 16:31
FERRAMENTAS/MYSQL
mas Unix, ele tem
capacidades mul-
tithread, ou seja,
roda várias versões
dele mesmo. No
Windows NT, 2000,
XP ou 2003, o
MySQL roda como
um serviço. Já no
Windows 95/98, fi-
ca como uma jane-
la do DOS minimi-
zada. O banco de
dados também con- MySQL Control Center: visualização e controle de funções
ta com drivers de
ODBC para outras aplicações.
Instalado em um servidor isola-
do, o MySQL é um banco de dados
veloz e estável. O grande diferencial
está na possibilidade de se integrar
à internet por meio de um interpre-
tador de linguagem, como PHP, Perl
ou TCL e até mesmo ASP. Essa com-
binação, instalada e compilada, por
exemplo, em um servidor rodando
o Apache, gera páginas dinâmicas
com as informações vindas em tem-
po real do banco de dados.
Se você não tem um servidor pró-
prio e utiliza um provedor para hos-
pedar seu site, é preciso encontrar um
que já ofereça esse serviço. Isso por-
que a instalação do PHP e do MySQL
para montagem de sites dinâmicos
exige ter direitos sobre o servidor. Por
questões de segurança, os provedo-
res normalmente não dão essas liber-
dades a quem opta por serviços de
hosting compartilhado. Porém, se vo-
cê é o administrador de seu servidor,
20 < C O L E Ç Ã O I N F O
Page 20
primeiramente deve ter o Apache ro-
dando como servidor de web.
O primeiro passo é baixar a última
versão do MySQL (www.info.abril.
com.br/download/2901.shtml), que
está diponível em quatro sabores:
• MySQL Standard – Conta com as
funções-padrão e suporte a InnoDB,
sistema de transações seguras.
• MySQL Max – Inclui as funções
da versão Standard e recursos no-
vos avançados, como sistemas de
armazenamento para cluster e
Berkeley Database.
• MySQL Cluster – Versão de alta
performance para cluster de ban-
co de dados.
• MaxDB – Edição para grandes em-
presas,antes conhecida como SAP DB.
O MySQL-padrão está na versão
4.1.11. Já existe uma versão 5.0 em
desenvolvimento, liberada apenas
para testes. Se você está começan-
do no mundo Unix, pode escolher
uma das várias opções pré-compi-
ladas; se já é experiente, baixe o có-
digo-fonte para compilar em seu
servidor. No tutorial de instalação
a seguir, utilizamos o MySQL Max
na distribuição Linux Suse 9.2, com
servidor web Apache, PHP e com-
partilhador de arquivos Samba.
> A INSTALAÇÃO
1. Antes de mais nada, gere um
grupo de usuários chamado mysql
com o seguinte comando:
groupadd mysql
Em seguida, crie um usuário
mysql digitando:
useradd –g mysql mysql
Esse usuário será utilizado pelos
programas para entrar no MySQL,
fazer pesquisas e trazer resultados.
2. Depois de terminado o down-
load, vá até o diretório onde está
salvo o arquivo e descompacte usan-
do o tar. Para isso, digite a linha:
tar xvzf mysql-xxxx.tar.gz
O xxxx é o espaço em que você de-
ve colocar a versão
que você baixou. Is-
so vai criar um di-
retório mysql-xxxx.
3. Localize esse di-
retório e dê uma
boa olhada nos ar-
quivos de READ-
ME. Eles podem
ajudá-lo em várias
situações críticas.
Nessa versão do
MySQL não é ne-
cessário compilar
o programa, ele já YaST: facilidade do Suse no controle do banco de dados
FERRAMENTAS/MYSQL
vem pronto para ser usado, então
apenas renomeie o diretório mysql-
xxx para mysql:
mv mysql-xxx mysql
4. Agora vamos instalar os bancos de
dados-padrão necessários para que o
MySQL funcione, dando o comando
scripts/mysql_install_db
5. Acerte as permissões do diretó-
rio de instalação da seguinte forma:
chown –R root .
chown –R mysql data
chgrp –R mysql .
6. Inicie o mysql com
bin/mysqld_safe --user=mysql &
7. É preciso dar ao programa a ca-
pacidade de começar e parar o ser-
viço quando o servidor inicializar e
quando desligar. Como ele já vem
com um script que faz isso, copie o
arquivo supprot-files/mysql.server
para o diretório /etc/rc.d e configu-
re o sistema para carregá-lo. No Su-
se, basta abrir o YaST System e aces-
sar o editor de runlevel.
C O L E Ç Ã O I N F O > 21
FERRAMENTAS/MY SQL 1 23.05.05 16:31
FERRAMENTAS/MYSQL
mas Unix, ele tem
capacidades mul-
tithread, ou seja,
roda várias versões
dele mesmo. No
Windows NT, 2000,
XP ou 2003, o
MySQL roda como
um serviço. Já no
Windows 95/98, fi-
ca como uma jane-
la do DOS minimi-
zada. O banco de
dados também con- MySQL Control Center: visualização e controle de funções
ta com drivers de
ODBC para outras aplicações.
Instalado em um servidor isola-
do, o MySQL é um banco de dados
veloz e estável. O grande diferencial
está na possibilidade de se integrar
à internet por meio de um interpre-
tador de linguagem, como PHP, Perl
ou TCL e até mesmo ASP. Essa com-
binação, instalada e compilada, por
exemplo, em um servidor rodando
o Apache, gera páginas dinâmicas
com as informações vindas em tem-
po real do banco de dados.
Se você não tem um servidor pró-
prio e utiliza um provedor para hos-
pedar seu site, é preciso encontrar um
que já ofereça esse serviço. Isso por-
que a instalação do PHP e do MySQL
para montagem de sites dinâmicos
exige ter direitos sobre o servidor. Por
questões de segurança, os provedo-
res normalmente não dão essas liber-
dades a quem opta por serviços de
hosting compartilhado. Porém, se vo-
cê é o administrador de seu servidor,
20 < C O L E Ç Ã O I N F O
Page 20
primeiramente deve ter o Apache ro-
dando como servidor de web.
O primeiro passo é baixar a última
versão do MySQL (www.info.abril.
com.br/download/2901.shtml), que
está diponível em quatro sabores:
• MySQL Standard – Conta com as
funções-padrão e suporte a InnoDB,
sistema de transações seguras.
• MySQL Max – Inclui as funções
da versão Standard e recursos no-
vos avançados, como sistemas de
armazenamento para cluster e
Berkeley Database.
• MySQL Cluster – Versão de alta
performance para cluster de ban-
co de dados.
• MaxDB – Edição para grandes em-
presas,antes conhecida como SAP DB.
O MySQL-padrão está na versão
4.1.11. Já existe uma versão 5.0 em
desenvolvimento, liberada apenas
para testes. Se você está começan-
do no mundo Unix, pode escolher
uma das várias opções pré-compi-
ladas; se já é experiente, baixe o có-
digo-fonte para compilar em seu
servidor. No tutorial de instalação
a seguir, utilizamos o MySQL Max
na distribuição Linux Suse 9.2, com
servidor web Apache, PHP e com-
partilhador de arquivos Samba.
> A INSTALAÇÃO
1. Antes de mais nada, gere um
grupo de usuários chamado mysql
com o seguinte comando:
groupadd mysql
Em seguida, crie um usuário
mysql digitando:
useradd –g mysql mysql
Esse usuário será utilizado pelos
programas para entrar no MySQL,
fazer pesquisas e trazer resultados.
2. Depois de terminado o down-
load, vá até o diretório onde está
salvo o arquivo e descompacte usan-
do o tar. Para isso, digite a linha:
tar xvzf mysql-xxxx.tar.gz
O xxxx é o espaço em que você de-
ve colocar a versão
que você baixou. Is-
so vai criar um di-
retório mysql-xxxx.
3. Localize esse di-
retório e dê uma
boa olhada nos ar-
quivos de READ-
ME. Eles podem
ajudá-lo em várias
situações críticas.
Nessa versão do
MySQL não é ne-
cessário compilar
o programa, ele já YaST: facilidade do Suse no controle do banco de dados
FERRAMENTAS/MYSQL
vem pronto para ser usado, então
apenas renomeie o diretório mysql-
xxx para mysql:
mv mysql-xxx mysql
4. Agora vamos instalar os bancos de
dados-padrão necessários para que o
MySQL funcione, dando o comando
scripts/mysql_install_db
5. Acerte as permissões do diretó-
rio de instalação da seguinte forma:
chown –R root .
chown –R mysql data
chgrp –R mysql .
6. Inicie o mysql com
bin/mysqld_safe --user=mysql &
7. É preciso dar ao programa a ca-
pacidade de começar e parar o ser-
viço quando o servidor inicializar e
quando desligar. Como ele já vem
com um script que faz isso, copie o
arquivo supprot-files/mysql.server
para o diretório /etc/rc.d e configu-
re o sistema para carregá-lo. No Su-
se, basta abrir o YaST System e aces-
sar o editor de runlevel.
C O L E Ç Ã O I N F O > 21
FERRAMENTAS/MY SQL 1 23.05.05 16:32 Page 22

FERRAMENTAS/MYSQL FERRAMENTAS/MYSQL

Nesse comando, o xxx se refere o PHP com suporte a MySQL e

GERENCIAMENTO à versão que você escolheu. Loca- Apache.
GRÁFICO lize o diretório php-4.xxx que foi 2. Agora, no mesmo diretório, digite:
criado na descompactação e digite make
O MySQL não vem com
este comando (na mesma linha): Pressione Enter. Quando estiver
uma interface gráfica
./configure--with-mysql--with- concluído, escreva:
para seu gerenciamento,
apache=../apache_xxxx--enable- make install
mas isso não é problema.
track-vars Aperte Enter. Seu Unix ou Linux
Existem vários programas
O xxxx, desta vez, é para a ver- irá compilar o PHP para funcionar
que fazem esse trabalho
são do Apache. Ele irá compilar com o kernel da máquina.
e estão disponíveis para
download na internet.
A própria MySQL AB conta MYSQL NO WINDOWS
com uma interface de
Se você tentou instalar a modo de autenticação antigo.
controle. A versão antiga
versão 4 do MySQL no seu Basta executar esta query:
se chamava MySQLGUI
Windows pode ter encontrado update user set password =
e foi substituída
alguma dificuldade ao fazer a old_password(‘senha’) where
pela MySQL Control Center.
conexão com o banco e user = ‘usuário’;
Ela pode ser baixada
Administração: a aba Status dá agilidade deparado com o erro: flush privileges;
gratuitamente em
para fazer comparações do uso do servidor Client does not support Assim, para esse usuário será
www.info.abril.com.br/
authentication protocol usado o método de
download/3185.shtml.
O MySQLCC permite montar > O PHP requested by server; consider autenticação do MySQL 3.
Agora que você já tem o MySQL con- upgrading
queries (pesquisas nos
figurado e rodando, necessita do MySQL client
bancos de dados) utilizando
PHP para completar o serviço de in- Isso acontece
a sintaxe de edição de texto
teratividade. Depois de instalar o porque o client
do SQL e apresenta os
PHP, você precisará compilar o Apa- para MySQL que
resultados em tabelas.
che para trabalhar com MySQL e vem no PHP 4
Com o MySQLCC você
PHP. Caso a sua instalação do PHP não tem total
também pode criar e
não tenha suporte a MySQL, siga os suporte à versão
gerenciar os bancos de
seguintes passos: 4, apenas para a
dados e as tabelas. Além
disso, é possível reparar
1. Baixe a última versão do código- 3. Mas não se
fonte do PHP (www.info.abril.com. desespere — o
e otimizar as tabelas.
br/download/2550.shtml). No nos- único conflito
Por fim, o MySQLCC faz
so teste, usamos a edição 4.3.11, uma que existe é na
o gerenciamento do
vez que a 5.0 ainda apresenta pro- autenticação.
servidor, podendo
blemas de compatibilidade. Nave- Para resolver o
mudar as variáveis
gue até o diretório /usr/local/src e problema, salve
e mostrar como estão Alterando senha: para PHP 4 rodando em Windows
expanda o arquivo com: as senhas no
os recursos em uso.
tar -xvzf php-4.xxx.tar.gz

22 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 23
FERRAMENTAS/MY SQL 1 23.05.05 16:32 Page 22

FERRAMENTAS/MYSQL FERRAMENTAS/MYSQL

Nesse comando, o xxx se refere o PHP com suporte a MySQL e

GERENCIAMENTO à versão que você escolheu. Loca- Apache.
GRÁFICO lize o diretório php-4.xxx que foi 2. Agora, no mesmo diretório, digite:
criado na descompactação e digite make
O MySQL não vem com
este comando (na mesma linha): Pressione Enter. Quando estiver
uma interface gráfica
./configure--with-mysql--with- concluído, escreva:
para seu gerenciamento,
apache=../apache_xxxx--enable- make install
mas isso não é problema.
track-vars Aperte Enter. Seu Unix ou Linux
Existem vários programas
O xxxx, desta vez, é para a ver- irá compilar o PHP para funcionar
que fazem esse trabalho
são do Apache. Ele irá compilar com o kernel da máquina.
e estão disponíveis para
download na internet.
A própria MySQL AB conta MYSQL NO WINDOWS
com uma interface de
Se você tentou instalar a modo de autenticação antigo.
controle. A versão antiga
versão 4 do MySQL no seu Basta executar esta query:
se chamava MySQLGUI
Windows pode ter encontrado update user set password =
e foi substituída
alguma dificuldade ao fazer a old_password(‘senha’) where
pela MySQL Control Center.
conexão com o banco e user = ‘usuário’;
Ela pode ser baixada
Administração: a aba Status dá agilidade deparado com o erro: flush privileges;
gratuitamente em
para fazer comparações do uso do servidor Client does not support Assim, para esse usuário será
www.info.abril.com.br/
authentication protocol usado o método de
download/3185.shtml.
O MySQLCC permite montar > O PHP requested by server; consider autenticação do MySQL 3.
Agora que você já tem o MySQL con- upgrading
queries (pesquisas nos
figurado e rodando, necessita do MySQL client
bancos de dados) utilizando
PHP para completar o serviço de in- Isso acontece
a sintaxe de edição de texto
teratividade. Depois de instalar o porque o client
do SQL e apresenta os
PHP, você precisará compilar o Apa- para MySQL que
resultados em tabelas.
che para trabalhar com MySQL e vem no PHP 4
Com o MySQLCC você
PHP. Caso a sua instalação do PHP não tem total
também pode criar e
não tenha suporte a MySQL, siga os suporte à versão
gerenciar os bancos de
seguintes passos: 4, apenas para a
dados e as tabelas. Além
disso, é possível reparar
1. Baixe a última versão do código- 3. Mas não se
fonte do PHP (www.info.abril.com. desespere — o
e otimizar as tabelas.
br/download/2550.shtml). No nos- único conflito
Por fim, o MySQLCC faz
so teste, usamos a edição 4.3.11, uma que existe é na
o gerenciamento do
vez que a 5.0 ainda apresenta pro- autenticação.
servidor, podendo
blemas de compatibilidade. Nave- Para resolver o
mudar as variáveis
gue até o diretório /usr/local/src e problema, salve
e mostrar como estão Alterando senha: para PHP 4 rodando em Windows
expanda o arquivo com: as senhas no
os recursos em uso.
tar -xvzf php-4.xxx.tar.gz

22 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 23
FERRAMENTAS/MY SQL 1 23.05.05 16:32 Page 24

FERRAMENTAS/MYSQL

> O SERVIDOR WEB cp php.ini-dist /usr/local/lib/

Com essa etapa completada, é pre-
ciso fazer com que o Apache reco-
nheça e trabalhe com PHP.
1. Navegue até o diretório do Apa-
che e digite na mesma linha:
./configure --prefix=/www --
activate-module=src/
modules/php4/libphp4.a
Esse comando cria o diretório
/www, onde ficará guardado o seu
site. Agora digite:
make
E aperte Enter. Quando o coman-
do terminar, digite:
make install
Tecle Enter novamente. Esse co-
mando irá compilar o Apache para
funcionar com o kernel de sua má-
quina. Quando a compilação termi-
nar, navegue até o diretório php4-
4.x e digite o seguinte:
php. ini
Assim você diz onde o PHP en-
contra sua biblioteca de referência.
2. Para terminar, vá até o diretório
/etc/httpd/conf e localize o arqui-
vo httpd.conf. Abra-o em um editor
de texto e coloque a seguinte linha:
AddType application/
x-httpd-php .php
Salve o arquivo. Esse comando
vai dizer ao Apache para interpre-
tar os arquivos .php como um ser-
viço PHP.
Reinicie o Apache com o comando:
apachectl restart
Pronto: você já pode começar a
construir páginas dinâmicas. Para uti-
lizar melhor o MySQL, você deverá
aprender os comandos de realização
de pesquisas, criação de tabelas e
administração do banco de dados.

MySQL 4.1.11
> FABRICANTE MySQL AB
> O QUE É Banco de dados de código aberto
> PRÓ Rápido e fácil de instalar e configurar
> CONTRA Não tem certos recursos sofisticados, como
vistas (views)
> RECURSOS 6,0
Todos os básicos mais transações
> FACILIDADE DE USO 7,0
Sem interface gráfica própria, pode ser
gerenciado por ferramentas auxiliares
> COMPATIBILIDADE 9,0
Tem versões para Windows, Mac OS, Linux e
outros sistemas baseados em Unix
> AVALIAÇÃO TÉCNICA(1) 7,2
> PREÇO Grátis
> CUSTO/BENEFÍCIO
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Recursos
(40%), Facilidade de uso (30%) e Compatibilidade (30%).

24 < C O L E Ç Ã O I N F O
FERRAMENTAS/ ACCESS 23.05.05 16:35
O ACCESS MANDA
BEM NA INTERNET
O BANCO DE DADOS PODE FUNCIONAR ONLINE OU OFFLINE,
DE ACORDO COM A NECESSIDADE DO SITE
m dos bancos de dados
U mais conhecidos do
mercado, o Access, da
Microsoft, é uma opção
interessante para a automação de
sites em tarefas despretensiosas.
Há basicamente duas formas de fa-
zer com que a sua base Access vá pa-
ra a internet. Uma delas consiste em
ligar o banco a uma linguagem de au-
tomação, como PHP ou ASP. Outra
opção, mais simples e com menos re-
cursos, é recorrer a um software que
lê as informações do banco de dados
e as transforma em documentos
HTML, estáticos. Vamos a elas.
Access: a configuração do banco de dados,
pelo método ODBC, é fácil
Page 25
FERRAMENTAS/ACCESS
1. Banco online
Quem lida com linguagens de au-
tomação, como PHP ou ASP, deve
configurar o Data Source Name
(DSN) do banco de dados. Com is-
so, pode-se testar o site dinâmico
localmente desde que haja um ser-
vidor web instalado na máquina. O
DSN serve como identificador do
banco de dados em qualquer cone-
xão criada por meio do método
ODBC, presente no Windows.
Faça o seguinte:
A. No painel de controle do Windows,
há um ícone chamado ODBC (em al-
gumas versões do sistema ele está
dentro do grupo Ferra-
mentas Administrativas).
Clique nele para abrir a
janela do ODBC.
C O L E Ç Ã O I N F O > 25
FERRAMENTAS/ ACCESS 23.05.05 16:36 Page 26

FERRAMENTAS/ACCESS

B. Na aba DSN de
usuário, escolha a
opção Banco de da-
dos Access e clique
em Adicionar.
C. Na tela seguin-
te, selecione o dri-
ver adequado ao
banco. No caso, é
o driver próprio do
Microsoft Access.
D. A seguir, você
definirá o nome de
identificação do
banco (DSN) e se- DB to HTML Express: a consulta na tela de SQL gera o HTML
lecionará o arqui-
vo mdb (botão Selecionar). A des- co de dados e a tabela que fornece-
crição do DSN é opcional. Clique rá os dados para as páginas.
em OK e seu DSN estará criado. B. Depois, na tela de SQL, executa-
Ao escolher a empresa de hospe- mos a consulta.
dagem para o site, é bom verificar C. A partir daí, é gerada uma pági-
se o servidor tem suporte para ban- na HTML e fazemos os ajustes ne-
cos Access. Além disso, o usuário de- cessários na aba Page layout. É aqui
ve informar ao administrador o DSN que podemos, por exemplo, regu-
do banco de dados para que ele pos- lar o número de registros exibidos
sa ser configurado corretamente. em cada página. O DB to HTML in-
clui links de Anterior e Próximo au-
2. Publicação offline tomaticamente quando necessário.
Outra maneira de criar um site com D. A aba Template preview mostra
base em um banco de dados Ac- o código HTML do arquivo e per-
cess é usar um software auxiliar mite fazer as modificações direta-
para gerar as páginas. Existem di- mente na fonte. Na aba Preview te-
versos programas com essa finali- mos o resultado.
dade na web. Escolhemos o DB to Todo o processo de geração de
HTML Express (www.info.abril.com. páginas pode ser guardado como
br/download/3200.shtml), da XLi- um projeto. Assim, não precisamos
neSoft, pela facilidade de uso. Ve- repetir o processo para criar nova-
ja como ele funciona: mente a página. Outros recursos
A. Na tela principal, clicamos no bo- úteis do programa são o upload via
tão Connect para selecionar o ban- FTP e a geração de arquivos PDF.

26 < C O L E Ç Ã O I N F O
FERRAMENTAS/FIREBIRD 23.05.05 16:38 Page 27

FERRAMENTAS/FIREBIRD

BANCO DE DADOS
ASSIM É ÓTIMO!
O FIREBIRD 1.5 TEM RECURSOS PODEROSOS, POUPA
MEMÓRIA E PROCESSADOR E É DE GRAÇA
POR ERIC COSTA

banco de dados Firebird INFO testou a versão SuperServer

O está cada vez melhor,

acompanhando os avan-
ços dos concorrentes de
código aberto MySQL e PostgreSQL.
do Firebird (www.info.abril.com.br/
download/2108.shtml), voltada pa-
ra ambientes de produção. Outra ver-
são, a Classic, é dedicada a ambien-
Nascido de uma iniciativa da Borland tes de desenvolvimento, permitindo
de abrir o código do seu banco Inter- o acesso direto aos arquivos de da-
base 6, o Firebird chegou à versão 1.5 dos e rodando tarefas em vários pro-
bem mudado. Foi completamente tra- cessos. A versão SuperServer é sob
duzido da linguagem C para a C++ e, medida para voar: usa threads, que
entre as novidades, traz as nested possibilitam criar tarefas de forma
transactions, que permitem aplicar mais leve do que processos, consu-
novas regras de negócio quando uma mindo menos memória e recursos do
transação encontra um erro, sem pre- sistema operacional. Em compensa-
cisar desfazer toda a operação. Para ção, o SuperServer não permite abrir
a alegria geral dos usuários, foram os arquivos de dados diretamente.
mantidos os pontos fortes
do Firebird em relação aos
outros bancos de dados de
código aberto. Exemplos
são os recursos de triggers,
stored procedures e tran-
sações concorrentes, que
se beneficiam dos anos de
experiência e de correção
de código do Interbase. No
MySQL, o mais popular
banco de dados livre, es-
sas funções só aparece-
ram mais recentemente. IBExpert: gerencia usuários e tabelas do Firebird

C O L E Ç Ã O I N F O > 27
FERRAMENTAS/FIREBIRD 23.05.05 16:39 Page 28

FERRAMENTAS/FIREBIRD

Nos testes no INFOLAB, usamos mas usando o Firebird como backend

uma máquina Athlon XP 2200+ com
Windows 2003. Conseguimos criar
uma base de dados para armazenar
clientes em poucos minutos, usando
a ferramenta de administração IBEx-
pert (disponível em www.info.abril.
com.br/download/4047.shtml). A
montagem do banco de dados é fa-
cilitada pela ferramenta, que ainda
permite rapidamente liberar e blo-
quear acessos de usuários.
Uma limitação do Firebird, como
acontece na maioria dos bancos de
dados de código aberto, é não tra-
zer nenhuma interface de adminis-
tração de dados e usuários. Mas
não se trata de uma limitação irre-
mediável: o site oficial do banco de
dados tem diversos programas que
permitem fazer essas operações.
Já quem vai desenvolver progra-
pode optar por praticamente qual-
quer linguagem de programação.
Existem pacotes para integrar o
banco de dados com Java e .Net,
além de PHP, Python, Perl, entre
outras. Em termos de compatibili-
dade, o Firebird roda nos Windows
2000, XP e 2003, além de Linux,
Mac OS X, Solaris e outros sistemas
baseados em Unix.
Para o futuro, o grupo de desen-
volvimento do Firebird trabalha em
melhorias de segurança, como a in-
tegração com sistemas LDAP, que
armazenam os usuários de uma re-
de. Entre os recursos novos em ges-
tação estão tabelas temporárias e
um sistema de backup incremen-
tal, que permitiria copiar apenas as
mudanças recentes do banco de
dados a cada dia ou semana.

Firebird 1.5 SuperServer

> FABRICANTE FirebirdSQL Foundation
> O QUE É Banco de dados de código aberto
> PRÓ Conta com recursos poderosos, como views,
transações concorrentes e eventos
> CONTRA Depende de aplicativos de terceiros para
administração
> RECURSOS 7,5
Traz todo o pacote básico de funções dos bons
bancos de dados comerciais
> FACILIDADE DE USO 6,5
Não tem interface gráfica de administração,
precisando de ferramentas auxiliares
> COMPATIBILIDADE 9,0
Tem versões para Windows, Mac OS X, Linux e outros
sistemas baseados em Unix
> AVALIAÇÃO TÉCNICA(1) 7,7
> PREÇO Grátis
> CUSTO/BENEFÍCIO
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Recursos (40%),
Facilidade de uso (30%) e Compatibilidade (30%).

28 < C O L E Ç Ã O I N F O
FERRAMENTAS/CMS 23.05.05 16:41 Page 29

FERRAMENTAS/CMS

PORTAL É COM
O XOOPS
COM ESSE GERENCIADOR DE CONTEÚDO
DÁ PARA CRIAR SITES PODEROSOS
POR CARLOS MACHADO

nome pode ser engraça- Xoops é necessário ter acesso a um

O do, mas o Xoops é uma

ferramenta séria de cria-
ção de sites dinâmicos,
que conseguiu formar no Brasil uma
servidor web com o banco de dados
MySQL e a linguagem PHP habilita-
dos. O servidor-padrão é o Apache,
normalmente rodando em sistema
comunidade do mundo de código- operacional Linux. O download do
fonte aberto bastante organizada. Si- Xoops 2.0.10 em português pode ser
gla de eXtensible Object Oriented Por- feito no endereço www.info.abril.
tal System — sistema de portais ex- com.br/download/3917.shtml.
tensível e orientado a objeto —, o A característica que mais se desta-
Xoops é uma ferramenta em PHP in- ca no produto é a flexibilidade. Quan-
dicada para a criação de portais co- do se instala o Xoops com a opção
merciais, páginas web pessoais, co- Standard e se ativa apenas o módulo
munidades, sites de notícias, intra- News, obtém-se o site mínimo, que
nets e blogs. O produto faz parte da corresponde a um weblog ou noticiá-
categoria de software
CMS — iniciais de content
management system ou
sistema de gerenciamen-
to de conteúdo.
Desenvolvido pela
Xoops Organisation
(com s mesmo), o pro-
duto consiste num pa-
cote básico que pode ser
estendido mediante a
instalação de módulos
avulsos que acrescen-
tam ao site novas fun-
ções. Para instalar o Administração: instalação e configuração numa tela

C O L E Ç Ã O I N F O > 29
FERRAMENTAS/CMS 23.05.05 16:41 Page 30
FERRAMENTAS/CMS
rio. Para uma es-
trutura de porte
médio, pode-se
ativar, além de
Notícias, módu-
los como Fórum,
Download e Web
Links. Forma-se
assim um site
com recursos pa-
ra a formação de
uma comunida-
de, na qual os
membros cadas-
Site com Xoops: recursos aos montes
trados podem in-
teragir entre si e com os visitantes. A
mesma estrutura, reconfigurada, po-
de tornar-se um site corporativo. Nes-
se caso, a empresa tem a opção de
desenvolver módulos próprios, ajus-
tados às suas necessidades específi-
cas, ou selecionar módulos na vasta
biblioteca de código aberto franquea-
da pela comunidade xoopista. No si-
te central da comunidade (www.
Xoops.org) pode-se baixar em torno
de 300 módulos para os mais varia-
dos fins, em categorias como multi-
mídia, manipulação de imagens, me-
canismos de busca, publicação de no-
tícias, e-commerce, salas de bate-pa-
po, calendários e grupos de discussão.
> BUSCA INTERNA
Alguns módulos nativos — incluídos
na instalação-padrão — merecem des-
taque especial. Um deles é o meca-
nismo de busca interna, que dá ao
usuário a facilidade de fazer pesqui-
sas dentro do site. Trata-se de um re-
30 < C O L E Ç Ã O I N F O
curso importan-
te em qualquer
site, mas funda-
mental em sites
de conteúdo,
cujo principal
acervo é o tex-
to. O módulo
de download é
também um ex-
celente recurso.
Além de permi-
tir a inclusão de
arquivos para
serem baixados
no próprio portal Xoops, ele geren-
cia os links para copiar arquivos em
outros sites e fornece estatísticas dos
itens mais baixados. Oferece até um
serviço de avisos, que alerta o usuá-
rio quando há novidades na seção.
O módulo que implementa fóruns,
também nativo, parece ser um dos
mais populares — pelos menos nos
sites das comunidades Xoops.
A instalação do Xoops é relativa-
mente fácil. Basta seguir as instruções
e ter algum conhecimento sobre o
servidor. Para quem vai montar um
site cujas opções se restringem ao pa-
cote básico do produto, também não
há dificuldade. Elas só começam a
aparecer quando se deseja fazer per-
sonalizações. É o caso, por exemplo,
de alterar o layout da página para al-
go diferente do que oferece um te-
ma escolhido. Para isso, o usuário pre-
cisa ter conhecimento que lhe per-
mita mexer nos códigos em PHP e
nos gabaritos de páginas.
FERRAMENTAS/CMS
> MÓDULOS INTEGRADOS vial e está fora do alcance dos cria-
A integração de módulos externos é dores de site menos experientes.
a tarefa que mais exige esforço do Mas quem tem dúvida sobre o
usuário. Cada módulo tem configu- Xoops não está sozinho. As comuni-
rações diferentes e seus próprios tru- dades xoopistas são ágeis nas res-
ques. Nesse momento, o usuário pre- postas quando se entra em seus fó-
cisa ter noção de administração de runs atrás de alguma solução. Ao en-
sistemas, a fim de definir os níveis de frentar alguns problemas de confi-
acesso de cada módulo e conteúdo. guração do Xoops, o INFOLAB recor-
Conforme o tipo de site, talvez seja reu a fóruns em comunidades brasi-
necessário definir esquemas comple- leiras — há três principais: Xoops Bra-
xos, como vários grupos de usuários, sil (http://br.xoops.org), XoopsBR
cada um com permissões diferentes. (www.xoopsbr.org) e Xoops Total
Num site que aceita a interação de (www.xoopstotal.com.br). Menos
visitantes, pode-se criar, por exem- de 20 minutos depois, a dúvida já es-
plo, grupos de usuários como “anô- tava solucionada. Nota-se, também,
nimos”, “registrados”, “editores” e no site principal e em outros da co-
“administradores”, cada qual com munidade, grande preocupação com
seus direitos. A configuração de po- a publicação de material didático com
líticas de acesso não é uma tarefa tri- dicas e documentação do produto.
XOOPS 2.0.10
> FABRICANTE The Xoops Organisation
> O QUE É Sistema de código aberto para a criação de sites
dinâmicos, como portais, intranets e blogs. A
solução baseia-se no banco de dados MySQL e
no servidor web Apache com PHP
> INSTALAÇÃO 8,0
A operação transcorre sem dificuldade, desde
que o usuário siga as instruções
> MÓDULOS 8,5
O produto traz um conjunto de recursos nativos
e pode ser estendido com módulos externos que
implementam funções especiais
> PERSONALIZAÇÃO 7,0
As opções de layout são um tanto engessadas.
Para obter um visual personalizado é preciso
programar
> GERENCIAMENTO DE
CONTEÚDO
7,5
Controle minucioso de tudo o que foi publicado
> AVALIAÇÃO TÉCNICA(1) 7,9
> PREÇO Grátis
> CUSTO/BENEFÍCIO
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Instalação (30%),
Módulos (30%), Personalização (20%) e Gerenciamento de conteúdo (20%).
C O L E Ç Ã O I N F O > 31
FERRAMENTAS/CMS 23.05.05 16:41 Page 30
FERRAMENTAS/CMS
rio. Para uma es-
trutura de porte
médio, pode-se
ativar, além de
Notícias, módu-
los como Fórum,
Download e Web
Links. Forma-se
assim um site
com recursos pa-
ra a formação de
uma comunida-
de, na qual os
membros cadas-
Site com Xoops: recursos aos montes
trados podem in-
teragir entre si e com os visitantes. A
mesma estrutura, reconfigurada, po-
de tornar-se um site corporativo. Nes-
se caso, a empresa tem a opção de
desenvolver módulos próprios, ajus-
tados às suas necessidades específi-
cas, ou selecionar módulos na vasta
biblioteca de código aberto franquea-
da pela comunidade xoopista. No si-
te central da comunidade (www.
Xoops.org) pode-se baixar em torno
de 300 módulos para os mais varia-
dos fins, em categorias como multi-
mídia, manipulação de imagens, me-
canismos de busca, publicação de no-
tícias, e-commerce, salas de bate-pa-
po, calendários e grupos de discussão.
> BUSCA INTERNA
Alguns módulos nativos — incluídos
na instalação-padrão — merecem des-
taque especial. Um deles é o meca-
nismo de busca interna, que dá ao
usuário a facilidade de fazer pesqui-
sas dentro do site. Trata-se de um re-
30 < C O L E Ç Ã O I N F O
curso importan-
te em qualquer
site, mas funda-
mental em sites
de conteúdo,
cujo principal
acervo é o tex-
to. O módulo
de download é
também um ex-
celente recurso.
Além de permi-
tir a inclusão de
arquivos para
serem baixados
no próprio portal Xoops, ele geren-
cia os links para copiar arquivos em
outros sites e fornece estatísticas dos
itens mais baixados. Oferece até um
serviço de avisos, que alerta o usuá-
rio quando há novidades na seção.
O módulo que implementa fóruns,
também nativo, parece ser um dos
mais populares — pelos menos nos
sites das comunidades Xoops.
A instalação do Xoops é relativa-
mente fácil. Basta seguir as instruções
e ter algum conhecimento sobre o
servidor. Para quem vai montar um
site cujas opções se restringem ao pa-
cote básico do produto, também não
há dificuldade. Elas só começam a
aparecer quando se deseja fazer per-
sonalizações. É o caso, por exemplo,
de alterar o layout da página para al-
go diferente do que oferece um te-
ma escolhido. Para isso, o usuário pre-
cisa ter conhecimento que lhe per-
mita mexer nos códigos em PHP e
nos gabaritos de páginas.
FERRAMENTAS/CMS
> MÓDULOS INTEGRADOS vial e está fora do alcance dos cria-
A integração de módulos externos é dores de site menos experientes.
a tarefa que mais exige esforço do Mas quem tem dúvida sobre o
usuário. Cada módulo tem configu- Xoops não está sozinho. As comuni-
rações diferentes e seus próprios tru- dades xoopistas são ágeis nas res-
ques. Nesse momento, o usuário pre- postas quando se entra em seus fó-
cisa ter noção de administração de runs atrás de alguma solução. Ao en-
sistemas, a fim de definir os níveis de frentar alguns problemas de confi-
acesso de cada módulo e conteúdo. guração do Xoops, o INFOLAB recor-
Conforme o tipo de site, talvez seja reu a fóruns em comunidades brasi-
necessário definir esquemas comple- leiras — há três principais: Xoops Bra-
xos, como vários grupos de usuários, sil (http://br.xoops.org), XoopsBR
cada um com permissões diferentes. (www.xoopsbr.org) e Xoops Total
Num site que aceita a interação de (www.xoopstotal.com.br). Menos
visitantes, pode-se criar, por exem- de 20 minutos depois, a dúvida já es-
plo, grupos de usuários como “anô- tava solucionada. Nota-se, também,
nimos”, “registrados”, “editores” e no site principal e em outros da co-
“administradores”, cada qual com munidade, grande preocupação com
seus direitos. A configuração de po- a publicação de material didático com
líticas de acesso não é uma tarefa tri- dicas e documentação do produto.
XOOPS 2.0.10
> FABRICANTE The Xoops Organisation
> O QUE É Sistema de código aberto para a criação de sites
dinâmicos, como portais, intranets e blogs. A
solução baseia-se no banco de dados MySQL e
no servidor web Apache com PHP
> INSTALAÇÃO 8,0
A operação transcorre sem dificuldade, desde
que o usuário siga as instruções
> MÓDULOS 8,5
O produto traz um conjunto de recursos nativos
e pode ser estendido com módulos externos que
implementam funções especiais
> PERSONALIZAÇÃO 7,0
As opções de layout são um tanto engessadas.
Para obter um visual personalizado é preciso
programar
> GERENCIAMENTO DE
CONTEÚDO
7,5
Controle minucioso de tudo o que foi publicado
> AVALIAÇÃO TÉCNICA(1) 7,9
> PREÇO Grátis
> CUSTO/BENEFÍCIO
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Instalação (30%),
Módulos (30%), Personalização (20%) e Gerenciamento de conteúdo (20%).
C O L E Ç Ã O I N F O > 31
FERRAMENTAS/E-COMMERCE 23.05.05
FERRAMENTAS/E-COMMERCE
O osCOMMERCE
FAZ A LOJA
O PROGRAMA VEM RECHEADO DE RECURSOS,
MAS É DURO DE CONFIGURAR
POR CARLOS MACHADO, COM OSMAR LAZZARINI
ontar lojas online é a
M missão que o osCom-
merce, um produto de
código aberto, cumpre
bem. Tanto que 1 417 sites de comér-
cio eletrônico cons-
truídos com o soft-
ware estavam ativos
na web no início de
maio. O osCommer-
ce é uma solução
completa para mon-
tar lojas online sem
exigir grandes co-
nhecimentos de pro-
gramação e sem cus-
tos. Criado com ba-
se na linguagem PHP, o
programa roda em várias platafor-
mas: Windows, Linux, Solaris, BSD e
Mac OS X. O requisito básico para
instalá-lo é o servidor web Apache
com PHP e banco de dados MySQL
habilitados. INFO testou a versão 2.2
do produto em ambiente Linux.
O que impressiona no osCommer-
ce é o volume de possibilidades que
ele oferece. A concepção do produ-
to prevê a instalação de uma loja bá-
sica, que depois pode ser incremen-
32 < C O L E Ç Ã O I N F O
16:43 Page 32
FERRAMENTAS/E-COMMERCE
zio e indicar ao instalador o caminho Se a instalação é fácil, a configura-
desse banco. Também durante a ins- ção é outra história. A escolha do idio-
talação, pode-se escolher a criação ma, por exemplo, deveria ser algo
de uma loja a partir do zero ou ini- absolutamente suave. Não é. Alguns
ciar com uma estrutura de demons- itens, como menus e legendas, in-
tração. Esta última opção é a mais in- sistem em aparecer em inglês. No
dicada, porque fornece uma apre- INFOLAB notamos vários erros de
sentação visual do padrão de lojas PHP e os problemas de acesso a da-
montadas com o osCommerce. dos durante a configuração. Nesses
Na instalação, grande número de casos, o material de ajuda não se re-
tada com novos recursos. Todos es- módulos fica à disposição na loja. No vela muito útil. Pode-se recorrer aos
ses recursos estão disponíveis em
módulos criados pela comunidade
de usuários. Até o encerramento des-
ta edição, havia 379 módulos para
próximo passo, a configuração, o cria-
dor da loja define os itens que deseja
usar. Alguns pacotes são obrigatórios.
O de idioma, por exemplo. Se a inten-
fóruns de discussão do osCommer-
ce, mas é preciso ter disposição pa-
ra garimpar uma resposta específica
no meio de milhares. Também se po-
gerenciar pagamentos, ção é vender para brasileiros, a loja de- de colocar uma pergunta no fórum
166 para controlar o en- verá falar português. Do mesmo mo- e aguardar que alguém forneça uma
vio de produtos e 123 do, é preciso escolher adequadamen- resposta adequada — o que, natural-
para ajustar o idio- te os módulos que definem formas de mente, nem sempre acontece. A enor-
ma, além de outros pagamento, cartão de crédito etc. me oferta de módulos tanto ajuda
1 954 pacotes com
funções variadas.
Entre eles há módu-
los específicos para
sites brasileiros, co-
mo controle de en-
trega por Sedex.
O primeiro passo para a monta-
gem da loja é baixar o osCommerce
(www.info.abril.com.br/download/
3911.shtml). A instalação do progra-
ma deve ser feita, de preferência, di-
retamente no servidor que hospeda-
rá a loja. Também é possível criar
uma loja local e, depois, fazer uma
série de ajustes a fim de transferi-la
corretamente para o servidor. Mas is-
so exige que o usuário tenha bastan-
te experiência. Ele precisa, por exem-
plo, criar um banco dados MySQL va- Loja com osCommerce: o visual pode ser modificado com temas variados
© ILUSTRAÇÃO STEFAN C O L E Ç Ã O I N F O > 33
FERRAMENTAS/E-COMMERCE 23.05.05
FERRAMENTAS/E-COMMERCE
O osCOMMERCE
FAZ A LOJA
O PROGRAMA VEM RECHEADO DE RECURSOS,
MAS É DURO DE CONFIGURAR
POR CARLOS MACHADO, COM OSMAR LAZZARINI
ontar lojas online é a
M missão que o osCom-
merce, um produto de
código aberto, cumpre
bem. Tanto que 1 417 sites de comér-
cio eletrônico cons-
truídos com o soft-
ware estavam ativos
na web no início de
maio. O osCommer-
ce é uma solução
completa para mon-
tar lojas online sem
exigir grandes co-
nhecimentos de pro-
gramação e sem cus-
tos. Criado com ba-
se na linguagem PHP, o
programa roda em várias platafor-
mas: Windows, Linux, Solaris, BSD e
Mac OS X. O requisito básico para
instalá-lo é o servidor web Apache
com PHP e banco de dados MySQL
habilitados. INFO testou a versão 2.2
do produto em ambiente Linux.
O que impressiona no osCommer-
ce é o volume de possibilidades que
ele oferece. A concepção do produ-
to prevê a instalação de uma loja bá-
sica, que depois pode ser incremen-
32 < C O L E Ç Ã O I N F O
16:43 Page 32
FERRAMENTAS/E-COMMERCE
zio e indicar ao instalador o caminho Se a instalação é fácil, a configura-
desse banco. Também durante a ins- ção é outra história. A escolha do idio-
talação, pode-se escolher a criação ma, por exemplo, deveria ser algo
de uma loja a partir do zero ou ini- absolutamente suave. Não é. Alguns
ciar com uma estrutura de demons- itens, como menus e legendas, in-
tração. Esta última opção é a mais in- sistem em aparecer em inglês. No
dicada, porque fornece uma apre- INFOLAB notamos vários erros de
sentação visual do padrão de lojas PHP e os problemas de acesso a da-
montadas com o osCommerce. dos durante a configuração. Nesses
Na instalação, grande número de casos, o material de ajuda não se re-
tada com novos recursos. Todos es- módulos fica à disposição na loja. No vela muito útil. Pode-se recorrer aos
ses recursos estão disponíveis em
módulos criados pela comunidade
de usuários. Até o encerramento des-
ta edição, havia 379 módulos para
próximo passo, a configuração, o cria-
dor da loja define os itens que deseja
usar. Alguns pacotes são obrigatórios.
O de idioma, por exemplo. Se a inten-
fóruns de discussão do osCommer-
ce, mas é preciso ter disposição pa-
ra garimpar uma resposta específica
no meio de milhares. Também se po-
gerenciar pagamentos, ção é vender para brasileiros, a loja de- de colocar uma pergunta no fórum
166 para controlar o en- verá falar português. Do mesmo mo- e aguardar que alguém forneça uma
vio de produtos e 123 do, é preciso escolher adequadamen- resposta adequada — o que, natural-
para ajustar o idio- te os módulos que definem formas de mente, nem sempre acontece. A enor-
ma, além de outros pagamento, cartão de crédito etc. me oferta de módulos tanto ajuda
1 954 pacotes com
funções variadas.
Entre eles há módu-
los específicos para
sites brasileiros, co-
mo controle de en-
trega por Sedex.
O primeiro passo para a monta-
gem da loja é baixar o osCommerce
(www.info.abril.com.br/download/
3911.shtml). A instalação do progra-
ma deve ser feita, de preferência, di-
retamente no servidor que hospeda-
rá a loja. Também é possível criar
uma loja local e, depois, fazer uma
série de ajustes a fim de transferi-la
corretamente para o servidor. Mas is-
so exige que o usuário tenha bastan-
te experiência. Ele precisa, por exem-
plo, criar um banco dados MySQL va- Loja com osCommerce: o visual pode ser modificado com temas variados
© ILUSTRAÇÃO STEFAN C O L E Ç Ã O I N F O > 33
FERRAMENTAS/E-COMMERCE 23.05.05 16:44 Page 34

FERRAMENTAS/E-COMMERCE

como atrapalha. Ajuda, porque per-
mite a montagem de lojas bastante
completas. Ao mesmo tempo, exige
experiência e conhecimento dos
meandros do osCommerce para en-
contrar módulos adequados às ne-
cessidades do lojista. Depois, para
configurar cada pacote. Mas em tec-
nologia, soluções robustas não são
mesmo vapt-vupt, certo?
Além das opções de módulos de
código-fonte aberto, há soluções con-
vencionais de software para o os-
Commerce. Só um exemplo: o Cobre
Bem e-Commerce, da Thisf Informá-
tica, programa CGI para emitir bole-
tos bancários. O produto pode ser
obtido por download (www.info.
abril.com.br/download/3915.shtml)
e testado na emissão de até trinta do-
cumentos. Depois disso, a loja pre-
cisa pagar uma licença de 147 reais.
Devido ao esforço de seleção e
implementação, o osCommerce é
indicado para o prestador de ser-
viços na área de desenvolvimento.
Esse profissional pode investir no
conhecimento do produto, selecio-
nar módulos e resolver os proble-
mas de instalação. Como especia-
lista, terá soluções testadas e po-
derá oferecer sua experiência ao
mercado. Ele fará a montagem da
loja e treinará o dono para as ati-
vidades de gerência. A principal for-
ça do osCommerce está nas contri-
buições da comunidade de código
aberto. Em geral, sempre se encon-
tra uma solução para implementar
novas funções na loja.

osCommerce 2.2 Milestone 2

> FABRICANTE osCommerce
> O QUE É Solução para montagem de lojas online
> PRÓ Grande quantidade de funções (módulos) disponíveis
para o produto
> CONTRA Falta um guia ou catálogo para a seleção de funções
> INSTALAÇÃO 7,3
Fácil, exige conhecimento mínimo de MySQL
> CONFIGURAÇÃO 6,5
Itens simples podem exigir longas tentativas de ajuste
> RECURSOS 7,8
O produto tem opções para criar lojas sofisticadas
> DOCUMENTAÇÃO 5,8
Não há um padrão de ajuda nem no módulo
básico nem nos adicionais
> COMPATIBILIDADE 8,0
Roda nas principais plataformas: Windows, Linux,
Solaris, BSD e Mac OS X
> AVALIAÇÃO TÉCNICA(1) 7,1
> PREÇO Grátis (Licença GPL)
> CUSTO/BENEFÍCIO
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Instalação (20%),
Configuração (30%), Recursos (30%), Documentação (10%) e Compatibilidade (10%).

34 < C O L E Ç Ã O I N F O
FERRAMENTAS/WIKI 24.05.05 12:40 Page 35

FERRAMENTAS/WIKI

PÁGINAS ABERTAS
AO CONTEÚDO
NOS SITES FEITOS COM AS DEMOCRÁTICAS FERRAMENTAS
WIKI, QUEM TRABALHA É O VISITANTE
POR AIRTON LOPES, COM OSMAR LAZARINI

ites totalmente demo- pende do software escolhido para a

S cráticos, em que os visi- tarefa. A variedade é enorme. No en-

tantes podem — e de- tanto, em termos de recursos, as di-
vem — acrescentar ou ferenças entre eles são poucas. To-
mudar o conteúdo sem o menor pu- dos produzem páginas enxutíssimas,
dor. Para construir um site desses, sem nenhuma sofisticação de design
as ferramentas certas são os wikis. ou funcionalidade. A diferença mar-
Uma vez instalado o wiki, basta cli- cante está na linguagem usada para
car no link de edição e alterar os tex- criar os programas e os requisitos
tos, inserir imagens à vontade nas que cada um exige do servidor que
páginas existentes ou mesmo criar hospedará o site wiki.
links para páginas novas. Claro que O INFOLAB montou três wikis com
nada impede os vândalos digitais de ferramentas diferentes: o OpenWi-
usar a liberdade para fins menos no- ki 0.78 SP1, o UseModWiki 1.0 e o
bres. Mesmo que
isso ocorra, não é
preciso se preo-
cupar, porque os
wikis permitem
rever as versões
anteriores e res-
taurá-las em ins-
tantes. Mais: os
vândalos são ra-
ríssimos em wikis.
Colocar no ar o
seu próprio wiki
também pode ser
algo igualmente
simples. Tudo de- wxWikiServer: com ele, o site wiki dispensa servidor web

C O L E Ç Ã O I N F O > 35
FERRAMENTAS/WIKI 23.05.05 16:46 Page 36

FERRAMENTAS/WIKI

wxWikiServer 1.5.11. O UseModWiki cursos de abas do CSS (Cascading

é, na verdade, um script Perl. A sua
lista de pré-requisitos? Apenas o ser-
vidor web Apache com Perl. No
OpenWiki, a exigência é um servi-
dor IIS com suporte a ASP e XML.
Mais simples ainda, pelo menos na
instalação, é o wxWikiServer. Ele pró-
prio funciona como servidor web,
utilizando a porta 8080 do PC.
Os três são capazes de gerar feeds
RSS (Really Simple Syndication), as-
sim os interessados conseguem ser
notificados no ato sobre alterações
no site. É difícil fugir, mas o aspecto
espartano dos wikis pode ser um pou-
co melhorado apelando para os re-
Style Sheets). Mas não espere mila-
gres. Simplicidade é a mola mestra
da filosofia wiki. As formatações são
feitas com um conjunto de marca-
ções próprio, mais simples do que o
HTML. Basta digitar qualquer pala-
vra entre dois colchetes para que se-
ja criada uma nova página. Quer co-
locar uma imagem no wiki? Digite a
URL na tela de edição. O OpenWiki
permite fazer o upload de arquivos.
A mesma ação pode ser feita no Use-
ModWiki, mas antes é preciso habi-
litar o recurso. Com tudo isso, só não
monta um site com as portas aber-
tas quem não quiser.

Wiki para todos os gostos

UseModWiki 1.0 OpenWiki 0.78 SP1 wxWikiServer
1.5.11
> DESENVOLVEDOR Clifford Adams Laurens Pit Eddie Edwards e
Ryan Norton
> TECNOLOGIA Apache e Perl IIS, ASP e XML XML
> INSTALAÇÃO 6,5 5,5 7,5
Simples, mas É preciso editar Simples, com
requer edição de um arquivo de assistente
arquivo configuração
> RECURSOS 6,0 6,5 6,0
RSS, suporte a CSS RSS, suporte a CSS RSS, suporte a CSS
e upload de e upload de
arquivos arquivos
> FACILIDADE DE 8,0 7,0 7,0
USO Busca interna As páginas são Página de
funciona bem e hierarquizadas administração
rápido com poucos
recursos
> AVALIAÇÃO 6,9 6,2 6,8
TÉCNICA(1)
> PREÇO Grátis Grátis Grátis
> CUSTO/
BENEFÍCIO
> ONDE www.info.abril. www.info.abril. www.info.abril.
ENCONTRAR com.br/download/ com.br/download/ com.br/download/
3789.shtml 3790.shtml 3791.shtml
(1) Média ponderada considerando os seguintes itens e respectivos pesos: Instalação (30%),
Recursos (35%) e Facilidade de uso (35%).

36 < C O L E Ç Ã O I N F O
FERRAMENTAS/SSI 23.05.05 16:48 Page 37
O SSI DISPENSA
BANCO E SCRIPT
SITES SIMPLES OU COM ATUALIZAÇÃO PARCIAL NÃO
PRECISAM DE TECNOLOGIAS COMPLEXAS
em sempre é preciso re-
N correr a um banco de da-
dos ou a tecnologias
complexas para construir
sites dinâmicos. Em projetos pouco
ambiciosos ou nos casos em que ape-
nas uma parte das páginas precisa
de atualização constante, o SSI (Ser-
ver Side Includes) é uma boa opção.
A rigor, o SSI é um conjunto de ins-
truções colocadas dentro de arqui-
vos HTML e interpretadas pelo ser-
vidor no momento em que as pági-
nas são exibidas. Com isso, é possí-
vel criar conteúdos dinâmicos sem a
necessidade de nenhuma outra tec-
nologia. O SSI pode ajudar em mui-
tas situações. Por exemplo:
A. Se você quer exibir a data e a ho-
ra de última atualização da página
ou a hora do momento em que o in-
ternauta está lendo.
B. Se você tem um site grande e quer
administrar com facilidade as áreas
fixas das páginas (cabeçalho, roda-
pé, barra de navegação etc.).
C. Se muitas páginas do seu site são
de conteúdo essencialmente não re-
novável, mas têm um trecho com
atualização freqüente. Uma página
que reúna, por exemplo, o histórico
FERRAMENTAS/SSI
da empresa (conteúdo que quase
nunca é alterado) e uma área com
notícias (de atualização constante).
Se suas demandas de automação
páram por aí, provavelmente o SSI
resolverá o problema integralmente.
Então, mãos à obra.
1. AJUSTE DO SERVIDOR
Para utilizar o SSI, é necessário que
o servidor web de seu site aceite es-
ses comandos — e que eles estejam
habilitados. Se você guarda o seu si-
te num serviço de hospedagem, con-
fira com o prestador se o SSI já está
habilitado ou qual o procedimento
correto para fazê-lo.
O SSI não é um padrão global, mas
funciona em todos os servidores mais
conhecidos, como Apache, Internet
Information Services (Microsoft) ou
Enterprise Server (Netscape). A for-
ma de habilitar o SSI varia em cada
modelo. Os exemplos deste texto re-
ferem-se ao Apache 1.3.33. Nesse ser-
vidor, você deve inserir a seguinte li-
nha de comando no arquivo httpd.
conf ou no arquivo .htaccess:
Options +Includes
Além disso, é preciso que os arqui-
vos que vão conter os includes te-
C O L E Ç Ã O I N F O > 37
FERRAMENTAS/SSI 23.05.05 16:49 Page 38
FERRAMENTAS/SSI
nham uma extensão
especial. Assim, o ser-
vidor saberá que de-
ve ler os arquivos à
procura de um trecho
dinâmico a ser inse-
rido no código.
As extensões va-
riam de servidor pa-
ra servidor: normal-
mente, usa-se .shtml
para Apache e .shl
para Netscape. No IIS, SSI: código para montar a página e criar os includes
utiliza-se a extensão-
padrão .asp. Se você administra seu
servidor Apache, faça o seguinte:
AddType text/html .shtml
AddHandler server-parsed .shtml
Se você utiliza um provedor de hos-
pedagem, lembre-se de conferir a ex-
tensão a ser empregada.
Resolvida a parte do servidor, é ho-
ra de partir para a montagem dos in-
cludes. Um include nada mais é que
um pequeno trecho de código colo-
cado no HTML informando ao servi-
dor como agir. Esses comandos são
contidos dentro de tags de comentá-
rio do HTML, ou seja, <!- - para iniciar
o comando e - -> para finalizar. Veja
a seguir exemplos do que é possível
fazer tendo como base o Apache.
2. DATA E HORA CERTAS
Nesse primeiro caso, vamos usar o
SSI para incluir num arquivo a data
atual, em que o internauta estiver
vendo a página. Para isso, basta acres-
centar ao HTML as seguintes tags:
<!-- #config timefmt=“
38 < C O L E Ç Ã O I N F O
%d/%m/%Y” -->
Hoje é <!--#echo var=”DATE_
LOCAL”-->
Elas devem ser colocadas no lo-
cal exato em que você quer que a
data apareça (o texto “Hoje é” é ape-
nas um exemplo). Podem também
ser antecedidas e seguidas de for-
matação HTML normal. A primeira
linha do comando configura o for-
mato da data. Escolhemos o forma-
to dd/mm/aaaa. A segunda linha or-
dena ao servidor que coloque a da-
ta local ao exibir a página.
Note que o horário a ser exibido
é o do relógio do servidor. Também
serão seguidas as formatações de
data estabelecidas no servidor. Ou
seja, se ele estiver com os dias da
semana configurados em inglês, eles
aparecerão assim na página.
Os dias da semana não entraram
no exemplo acima, mas poderiam
ser incluídos com a inserção do có-
digo %A. Ainda na questão tempo,
podemos também incluir a data e a
hora (%R) da última modificação do
arquivo. Veja:
<!--#config timefmt=“%R de
%d/%m/%Y” -->
Modificado às <!--#echo var= “
LAST_MODIFIED” -->
3. HTML EMBUTIDO
Embora os exemplos acima sejam
úteis, o SSI é usado principalmente
para permitir a colocação de um tre-
cho de HTML dentro de outro. Diga-
mos que seu site tenha 100 páginas
e todas elas tenham uma mesma
barra de navegação. O que aconte-
ce se for preciso mudar um item da
lista? Usando apenas HTML, seria
necessário reabrir cada arquivo pa-
ra fazer a mudança. Com o SSI, tu-
do fica mais fácil. Basta fazer com
que a barra seja um item de inclu-
de. Assim, com a simples alteração
de um arquivo, tudo estará automa-
ticamente renovado. Neste exemplo,
vamos supor que você queira colo-
Home da INFO Online: em cada área, um include
FERRAMENTAS/SSI
car um arquivo que contém apenas
a barra de navegação dentro dos ar-
quivos que compõem o site.
Para isso, cada HTML deve ter a
seguinte tag de include colocada no
exato local em que será exibida a
barra de navegação:
<!--#include virtual=“
barradena vegacao.shtml”-->
Lembre que a notação de diretó-
rios segue a mesma lógica dos links.
Ou seja, se o arquivo a ser chama-
do não estiver no mesmo diretório
do arquivo original, é preciso ano-
tar o caminho (por exemplo, include
virtual=“../barradenavegacao.
shtml” se o include localizar-se em
um diretório um nível acima).
Preparados os HTMLs, basta criar
a barra de navegação como um ar-
quivo à parte. Esse arquivo pode in-
cluir formatação HTML à vontade,
mas não deve conter as tags estru-
turais de uma página (ou seja, as tags
HTML, HEAD e BODY), já que ele se-
rá apenas um trecho
inserido no meio da
página final.
É possível a colo-
cação de vários in-
cludes numa mesma
página. Na prática,
quem utiliza esse sis-
tema costuma reta-
lhar a estrutura fixa
em uma série de in-
cludes — para barra
de navegação, roda-
pé, área de desta-
ques, de notícias etc.
C O L E Ç Ã O I N F O > 39
FERRAMENTAS/SSI 23.05.05 16:49 Page 38
FERRAMENTAS/SSI
nham uma extensão
especial. Assim, o ser-
vidor saberá que de-
ve ler os arquivos à
procura de um trecho
dinâmico a ser inse-
rido no código.
As extensões va-
riam de servidor pa-
ra servidor: normal-
mente, usa-se .shtml
para Apache e .shl
para Netscape. No IIS, SSI: código para montar a página e criar os includes
utiliza-se a extensão-
padrão .asp. Se você administra seu
servidor Apache, faça o seguinte:
AddType text/html .shtml
AddHandler server-parsed .shtml
Se você utiliza um provedor de hos-
pedagem, lembre-se de conferir a ex-
tensão a ser empregada.
Resolvida a parte do servidor, é ho-
ra de partir para a montagem dos in-
cludes. Um include nada mais é que
um pequeno trecho de código colo-
cado no HTML informando ao servi-
dor como agir. Esses comandos são
contidos dentro de tags de comentá-
rio do HTML, ou seja, <!- - para iniciar
o comando e - -> para finalizar. Veja
a seguir exemplos do que é possível
fazer tendo como base o Apache.
2. DATA E HORA CERTAS
Nesse primeiro caso, vamos usar o
SSI para incluir num arquivo a data
atual, em que o internauta estiver
vendo a página. Para isso, basta acres-
centar ao HTML as seguintes tags:
<!-- #config timefmt=“
38 < C O L E Ç Ã O I N F O
%d/%m/%Y” -->
Hoje é <!--#echo var=”DATE_
LOCAL”-->
Elas devem ser colocadas no lo-
cal exato em que você quer que a
data apareça (o texto “Hoje é” é ape-
nas um exemplo). Podem também
ser antecedidas e seguidas de for-
matação HTML normal. A primeira
linha do comando configura o for-
mato da data. Escolhemos o forma-
to dd/mm/aaaa. A segunda linha or-
dena ao servidor que coloque a da-
ta local ao exibir a página.
Note que o horário a ser exibido
é o do relógio do servidor. Também
serão seguidas as formatações de
data estabelecidas no servidor. Ou
seja, se ele estiver com os dias da
semana configurados em inglês, eles
aparecerão assim na página.
Os dias da semana não entraram
no exemplo acima, mas poderiam
ser incluídos com a inserção do có-
digo %A. Ainda na questão tempo,
podemos também incluir a data e a
hora (%R) da última modificação do
arquivo. Veja:
<!--#config timefmt=“%R de
%d/%m/%Y” -->
Modificado às <!--#echo var= “
LAST_MODIFIED” -->
3. HTML EMBUTIDO
Embora os exemplos acima sejam
úteis, o SSI é usado principalmente
para permitir a colocação de um tre-
cho de HTML dentro de outro. Diga-
mos que seu site tenha 100 páginas
e todas elas tenham uma mesma
barra de navegação. O que aconte-
ce se for preciso mudar um item da
lista? Usando apenas HTML, seria
necessário reabrir cada arquivo pa-
ra fazer a mudança. Com o SSI, tu-
do fica mais fácil. Basta fazer com
que a barra seja um item de inclu-
de. Assim, com a simples alteração
de um arquivo, tudo estará automa-
ticamente renovado. Neste exemplo,
vamos supor que você queira colo-
Home da INFO Online: em cada área, um include
FERRAMENTAS/SSI
car um arquivo que contém apenas
a barra de navegação dentro dos ar-
quivos que compõem o site.
Para isso, cada HTML deve ter a
seguinte tag de include colocada no
exato local em que será exibida a
barra de navegação:
<!--#include virtual=“
barradena vegacao.shtml”-->
Lembre que a notação de diretó-
rios segue a mesma lógica dos links.
Ou seja, se o arquivo a ser chama-
do não estiver no mesmo diretório
do arquivo original, é preciso ano-
tar o caminho (por exemplo, include
virtual=“../barradenavegacao.
shtml” se o include localizar-se em
um diretório um nível acima).
Preparados os HTMLs, basta criar
a barra de navegação como um ar-
quivo à parte. Esse arquivo pode in-
cluir formatação HTML à vontade,
mas não deve conter as tags estru-
turais de uma página (ou seja, as tags
HTML, HEAD e BODY), já que ele se-
rá apenas um trecho
inserido no meio da
página final.
É possível a colo-
cação de vários in-
cludes numa mesma
página. Na prática,
quem utiliza esse sis-
tema costuma reta-
lhar a estrutura fixa
em uma série de in-
cludes — para barra
de navegação, roda-
pé, área de desta-
ques, de notícias etc.
C O L E Ç Ã O I N F O > 39
FERRAMENTAS/SUÍTE 23.05.05 16:53
FERRAMENTAS/SUÍTE
Dreamweaver MX 2004: preocupação com os desenvolvedores de sites dinâmicos
MAIS PODER
AO STUDIO MX
COM DREAMWEAVER, FLASH E INTERFACE INTEGRADA,
A SUÍTE DOMINA O MERCADO DA WEB
POR CARLOS MACHADO, COM OSMAR LAZARINI
Studio MX, pacote de
O programas para desen-
volvimento de sites e
aplicações para a inter-
net da Macromedia, chegou à ver-
são 2004 como líder disparado no
mercado da grande rede. A suíte reú-
ne duas das ferramentas mais po-
pulares entre os webmasters, Dream-
weaver e Flash, dois bons progra-
mas gráficos, Fireworks e FreeHand,
40 < C O L E Ç Ã O I N F O
Page 40
e traz ainda uma versão especial pa-
ra desenvolvedores do servidor de
páginas dinâmicas ColdFusion. In-
clui também o HomeSite, software
que auxilia a escrita de código HTML.
Um dos pontos de maior destaque
na suíte é a integração de seus com-
ponentes. Juntos, eles oferecem uma
solução completa para webmasters
e desenvolvedores de aplicações on-
line. Nessa versão, somente os pro-
gramas Dreamweaver, Fireworks e
Flash foram atualizados. O ColdFu-
sion Developer Edition mudou de
versão (veja texto na página 16) de-
pois do lançamento da suíte, mas
pode ser atualizado de graça via
web. Todos os programas apresen-
tam uma nova interface unificada,
o que destaca o trabalho de integra-
ção aplicada nos produtos. O rede-
senho da interface amplia a área útil
de trabalho dos aplicativos, graças
a uma disposição mais inteligente
das ferramentas. Trabalha-se mais
à vontade com essa nova encarna-
ção dos programas.
> Dreamweaver MX 2004
A versão 2004 do Dreamweaver
revela preocupação com os desen-
volvedores de sites dinâmicos. A
interface do programa foi modifi-
cada, acrescentou-se mais elegân-
cia no visual e obtém-se melhor
aproveitamento da área de traba-
lho. Os assistentes, agora, são ilus-
trados, tornando as tarefas mais
agradáveis. A nova tela inicial traz
atalhos para arquivos recentes, tu-
toriais e extensões do programa.
A máquina que transforma sites
em grandes aplicações foi a que ob-
teve maiores reforços. O Dream-
weaver vai deixando a concorrên-
cia cada vez mais para trás e torna-
se uma ferramenta tipicamente vol-
tada para o profissional. Desse mo-
do, seu uso por iniciantes se torna
uma tarefa quase impossível. A área
de trabalho do programa está mais
FERRAMENTAS/SUÍTE
inteligente. Agora, os tradicionais
modos — Código, Design e Split —
não ficam mais em painéis separa-
dos: foram reunidos num único pai-
nel com botões e com outras fun-
ções importantes deixadas bem à
vista. Antes, por exemplo, o cam-
po para preenchimento do título
das páginas ficava escondido.
Outra função utilíssima é a veri-
ficação de compatibilidade com os
mais diversos browsers, como In-
ternet Explorer para Mac OS e Win-
dows, Mozilla, Netscape Navigator
e Opera em várias versões. Não dá
para nenhum desenvolvedor re-
clamar. Você configura a lista de
compatibilidade que deve ser ve-
rificada e, com dois cliques, o
Dreamweaver exibe a lista de pos-
síveis erros na posição onde nor-
malmente fica o painel de proprie-
dades. Um prático botão de teste
para os dados dinâmicos também
fica à vista do desenvolvedor, no
mesmo painel.
Igualmente interessantes são as
novas funções de edição de ima-
gens assumidas pelo produto. Ta-
refas simples como cortar e redi-
mensionar figuras podem ser feitas
diretamente no Dreamweaver sem
a necessidade de abrir um progra-
ma externo. O software também in-
corporou um inspetor de código CSS
que indica quando há erros no ar-
quivo. Para quem usa um software
de controle de versão, o Dreawea-
ver vem com botões de check-in e
check-out, impedindo que dois téc-
C O L E Ç Ã O I N F O > 41
FERRAMENTAS/SUÍTE 23.05.05 16:53
FERRAMENTAS/SUÍTE
Dreamweaver MX 2004: preocupação com os desenvolvedores de sites dinâmicos
MAIS PODER
AO STUDIO MX
COM DREAMWEAVER, FLASH E INTERFACE INTEGRADA,
A SUÍTE DOMINA O MERCADO DA WEB
POR CARLOS MACHADO, COM OSMAR LAZARINI
Studio MX, pacote de
O programas para desen-
volvimento de sites e
aplicações para a inter-
net da Macromedia, chegou à ver-
são 2004 como líder disparado no
mercado da grande rede. A suíte reú-
ne duas das ferramentas mais po-
pulares entre os webmasters, Dream-
weaver e Flash, dois bons progra-
mas gráficos, Fireworks e FreeHand,
40 < C O L E Ç Ã O I N F O
Page 40
e traz ainda uma versão especial pa-
ra desenvolvedores do servidor de
páginas dinâmicas ColdFusion. In-
clui também o HomeSite, software
que auxilia a escrita de código HTML.
Um dos pontos de maior destaque
na suíte é a integração de seus com-
ponentes. Juntos, eles oferecem uma
solução completa para webmasters
e desenvolvedores de aplicações on-
line. Nessa versão, somente os pro-
gramas Dreamweaver, Fireworks e
Flash foram atualizados. O ColdFu-
sion Developer Edition mudou de
versão (veja texto na página 16) de-
pois do lançamento da suíte, mas
pode ser atualizado de graça via
web. Todos os programas apresen-
tam uma nova interface unificada,
o que destaca o trabalho de integra-
ção aplicada nos produtos. O rede-
senho da interface amplia a área útil
de trabalho dos aplicativos, graças
a uma disposição mais inteligente
das ferramentas. Trabalha-se mais
à vontade com essa nova encarna-
ção dos programas.
> Dreamweaver MX 2004
A versão 2004 do Dreamweaver
revela preocupação com os desen-
volvedores de sites dinâmicos. A
interface do programa foi modifi-
cada, acrescentou-se mais elegân-
cia no visual e obtém-se melhor
aproveitamento da área de traba-
lho. Os assistentes, agora, são ilus-
trados, tornando as tarefas mais
agradáveis. A nova tela inicial traz
atalhos para arquivos recentes, tu-
toriais e extensões do programa.
A máquina que transforma sites
em grandes aplicações foi a que ob-
teve maiores reforços. O Dream-
weaver vai deixando a concorrên-
cia cada vez mais para trás e torna-
se uma ferramenta tipicamente vol-
tada para o profissional. Desse mo-
do, seu uso por iniciantes se torna
uma tarefa quase impossível. A área
de trabalho do programa está mais
FERRAMENTAS/SUÍTE
inteligente. Agora, os tradicionais
modos — Código, Design e Split —
não ficam mais em painéis separa-
dos: foram reunidos num único pai-
nel com botões e com outras fun-
ções importantes deixadas bem à
vista. Antes, por exemplo, o cam-
po para preenchimento do título
das páginas ficava escondido.
Outra função utilíssima é a veri-
ficação de compatibilidade com os
mais diversos browsers, como In-
ternet Explorer para Mac OS e Win-
dows, Mozilla, Netscape Navigator
e Opera em várias versões. Não dá
para nenhum desenvolvedor re-
clamar. Você configura a lista de
compatibilidade que deve ser ve-
rificada e, com dois cliques, o
Dreamweaver exibe a lista de pos-
síveis erros na posição onde nor-
malmente fica o painel de proprie-
dades. Um prático botão de teste
para os dados dinâmicos também
fica à vista do desenvolvedor, no
mesmo painel.
Igualmente interessantes são as
novas funções de edição de ima-
gens assumidas pelo produto. Ta-
refas simples como cortar e redi-
mensionar figuras podem ser feitas
diretamente no Dreamweaver sem
a necessidade de abrir um progra-
ma externo. O software também in-
corporou um inspetor de código CSS
que indica quando há erros no ar-
quivo. Para quem usa um software
de controle de versão, o Dreawea-
ver vem com botões de check-in e
check-out, impedindo que dois téc-
C O L E Ç Ã O I N F O > 41
FERRAMENTAS/SUÍTE 23.05.05 16:54 Page 42

FERRAMENTAS/SUÍTE FERRAMENTAS/SUÍTE

nicos de uma equi- Para os designers não progra- nu de Timeline Effects (efeitos de
pe trabalhem numa madores houve acréscimos de um linha do tempo) que permite usar
página ao mesmo excelente facilitador, idêntico ao atalhos para programar os recur-
tempo. Também foi existente no Dreamweaver. No sos mais comuns. Também é novi-
acrescentado o re- Flash MX 2004 existe agora um dade a capacidade de importar di-
curso Secure FTP, painel com behaviors. Os behaviors retamente arquivos do Illustrator
que garante cripto- — que, traduzidos, poderiam ser e PDFs, antes incompatíveis.
grafia na transferên- ações — são como macros pron- Um novo plug-in será necessário:
cia de arquivos en- tas que facilitam a execução de o Flash Player 7. Mas você também
tre as máquinas de operações comuns: carregar um poderá produzir animações para o
desenvolvimento e arquivo MP3, abrir um vídeo ou Flash Player 6, inclusive usando os
o site de destino. exibir uma janela. Em vez de es- novos componentes e até mesmo a
Na área de forma- crever o código para fazer isso, o linguagem Action Script 2. Mas o uso
tação, agora é pos- Flash MX Professional 2004: templates para palmtops usuário escolhe um behavior e ele da versão atual será mais convenien-
sível copiar e colar automaticamente insere os blocos te. Em testes do INFOLAB, o Flash
trechos de documentos vindos de MX Professional 2004. Isso, em con- de código que executam a tarefa Player 7 se saiu seis vezes mais rápi-
programas da Microsoft com a pre- seqüência, também define a exis- correspondente. Ainda na área de do do que o 6. O fabricante prome-
servação de cores e estilos CSS. Na tência de dois Studio MX 2004, con- código, o Flash MX ganhou um me- te performance de duas a dez vezes
parte de código, foram adicionados forme a versão do Flash incluída.
inspetores para ASP.Net, XML, sin- Para quem escreve código, o Studio MX 2004 com Flash MX Professional
taxe PHP, e objetos de controle de Flash MX 2004 traz o Action Script
> FABRICANTE Macromedia
formulários para ASP.Net. Na tela 2, a nova versão de sua linguagem
> O QUE É Pacote de software para desenvolvimento de
inicial, o programador escolhe a op- de desenvolvimento. Agora, o Ac- sites e aplicações para a internet
ção de plataforma com que vai tra- tion Script pode ser aberto sepa- > PRÓ A integração dos componentes, agora com
interface unificada
balhar, e o Dreamweaver se ajusta radamente do Flash, como um edi-
> CONTRA Nem todo desenvolvedor vai aproveitar o
convenientemente. tor independente. Nessa versão, FreeHand e o ColdFusion
o Action Script passa a ser uma > APLICATIVOS Dreamweaver MX 2004, Flash MX Professional
2004, Fireworks MX 2004, FreeHand MX e
> Flash MX 2004 linguagem baseada em classes, ColdFusion MX 6.1 Developer Edition
Na versão anterior do Flash, a MX, como Java e C#. Uma das vanta- > RECURSOS 9,0
Melhor suporte a folhas de estilo e a tecnologias
o usuário, ao entrar no aplicativo, gens disso é que o código fica mais de servidor
indicava se era um desenvolvedor limpo do que no Action Script 1 > INTEGRAÇÃO 7,5
O Dreamweaver centraliza o desenvolvimento e
— alguém mais voltado para os có- ou no Javascript, e o desenvolvi- compartilha recursos com outros programas
digos de programação — ou um de- mento orientado a objetos se tor- > COMPATIBILIDADE 8,0
Java, PHP, .Net, JSP, CSS, XML. O Flash importa
signer, o profissional mais preocu- na mais compreensível. Quem já EPS, PDF, AI, DXF, EMF, AVI, MOV etc.
pado com o equilíbrio visual das pá- programa em Action Script 1 não > AVALIAÇÃO TÉCNICA(1) 8,9
ginas. Conforme a escolha, o pro- precisa reaprender a lidar com a > PREÇO (R$) 2 763
grama exibia uma interface adequa- ferramenta: a sintaxe da versão 1 > CUSTO/BENEFÍCIO 8,4
da. Agora, a Macromedia decidiu continua compatível, dando ao de- (1) Média ponderada considerando os seguintes itens e respectivos pesos: Recursos (50%),
transformar o Flash em dois produ- senvolvedor a chance de absor- Integração (25%) e Compatibilidade (25%). O Studo MX recebeu meio ponto a mais na
avaliação técnica pelo bom desempenho da Macromedia na Pesquisa INFO de Marcas 2005.
tos distintos: Flash MX 2004 e Flash ver a nova linguagem aos poucos.

42 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 43
FERRAMENTAS/SUÍTE 23.05.05 16:54 Page 42

FERRAMENTAS/SUÍTE FERRAMENTAS/SUÍTE

nicos de uma equi- Para os designers não progra- nu de Timeline Effects (efeitos de
pe trabalhem numa madores houve acréscimos de um linha do tempo) que permite usar
página ao mesmo excelente facilitador, idêntico ao atalhos para programar os recur-
tempo. Também foi existente no Dreamweaver. No sos mais comuns. Também é novi-
acrescentado o re- Flash MX 2004 existe agora um dade a capacidade de importar di-
curso Secure FTP, painel com behaviors. Os behaviors retamente arquivos do Illustrator
que garante cripto- — que, traduzidos, poderiam ser e PDFs, antes incompatíveis.
grafia na transferên- ações — são como macros pron- Um novo plug-in será necessário:
cia de arquivos en- tas que facilitam a execução de o Flash Player 7. Mas você também
tre as máquinas de operações comuns: carregar um poderá produzir animações para o
desenvolvimento e arquivo MP3, abrir um vídeo ou Flash Player 6, inclusive usando os
o site de destino. exibir uma janela. Em vez de es- novos componentes e até mesmo a
Na área de forma- crever o código para fazer isso, o linguagem Action Script 2. Mas o uso
tação, agora é pos- Flash MX Professional 2004: templates para palmtops usuário escolhe um behavior e ele da versão atual será mais convenien-
sível copiar e colar automaticamente insere os blocos te. Em testes do INFOLAB, o Flash
trechos de documentos vindos de MX Professional 2004. Isso, em con- de código que executam a tarefa Player 7 se saiu seis vezes mais rápi-
programas da Microsoft com a pre- seqüência, também define a exis- correspondente. Ainda na área de do do que o 6. O fabricante prome-
servação de cores e estilos CSS. Na tência de dois Studio MX 2004, con- código, o Flash MX ganhou um me- te performance de duas a dez vezes
parte de código, foram adicionados forme a versão do Flash incluída.
inspetores para ASP.Net, XML, sin- Para quem escreve código, o Studio MX 2004 com Flash MX Professional
taxe PHP, e objetos de controle de Flash MX 2004 traz o Action Script
> FABRICANTE Macromedia
formulários para ASP.Net. Na tela 2, a nova versão de sua linguagem
> O QUE É Pacote de software para desenvolvimento de
inicial, o programador escolhe a op- de desenvolvimento. Agora, o Ac- sites e aplicações para a internet
ção de plataforma com que vai tra- tion Script pode ser aberto sepa- > PRÓ A integração dos componentes, agora com
interface unificada
balhar, e o Dreamweaver se ajusta radamente do Flash, como um edi-
> CONTRA Nem todo desenvolvedor vai aproveitar o
convenientemente. tor independente. Nessa versão, FreeHand e o ColdFusion
o Action Script passa a ser uma > APLICATIVOS Dreamweaver MX 2004, Flash MX Professional
2004, Fireworks MX 2004, FreeHand MX e
> Flash MX 2004 linguagem baseada em classes, ColdFusion MX 6.1 Developer Edition
Na versão anterior do Flash, a MX, como Java e C#. Uma das vanta- > RECURSOS 9,0
Melhor suporte a folhas de estilo e a tecnologias
o usuário, ao entrar no aplicativo, gens disso é que o código fica mais de servidor
indicava se era um desenvolvedor limpo do que no Action Script 1 > INTEGRAÇÃO 7,5
O Dreamweaver centraliza o desenvolvimento e
— alguém mais voltado para os có- ou no Javascript, e o desenvolvi- compartilha recursos com outros programas
digos de programação — ou um de- mento orientado a objetos se tor- > COMPATIBILIDADE 8,0
Java, PHP, .Net, JSP, CSS, XML. O Flash importa
signer, o profissional mais preocu- na mais compreensível. Quem já EPS, PDF, AI, DXF, EMF, AVI, MOV etc.
pado com o equilíbrio visual das pá- programa em Action Script 1 não > AVALIAÇÃO TÉCNICA(1) 8,9
ginas. Conforme a escolha, o pro- precisa reaprender a lidar com a > PREÇO (R$) 2 763
grama exibia uma interface adequa- ferramenta: a sintaxe da versão 1 > CUSTO/BENEFÍCIO 8,4
da. Agora, a Macromedia decidiu continua compatível, dando ao de- (1) Média ponderada considerando os seguintes itens e respectivos pesos: Recursos (50%),
transformar o Flash em dois produ- senvolvedor a chance de absor- Integração (25%) e Compatibilidade (25%). O Studo MX recebeu meio ponto a mais na
avaliação técnica pelo bom desempenho da Macromedia na Pesquisa INFO de Marcas 2005.
tos distintos: Flash MX 2004 e Flash ver a nova linguagem aos poucos.

42 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 43
FERRAMENTAS/SUÍTE 23.05.05 16:55
FERRAMENTAS/SUÍTE
maior, mas o resultado depende do
tipo de arquivo usado no filme.
Na versão Professional do Flash
MX 2004, destacam-se os recursos
para o desenvolvimento de aplica-
ções baseadas em formulários, no
estilo do que fazem os programa-
dores de Visual Basic e Delphi. O
produto também evoluiu para o
rumo do desenvolvimento basea-
do em componentes prontos. En-
tre os que vêm no pacote encon-
tram-se objetos virtuais para aces-
so a dados. Também merecem re-
ferência os numerosos templates
novos, especialmente os destina-
dos ao desenvolvimento de apli-
cações para Pocket PC ou telefo-
nes celulares. Ao se escolher um
modelo de equipamento, a tela da
aplicação assume as característi-
Fireworks MX 2004: ferramentas de trabalho colaborativo e integração
44 < C O L E Ç Ã O I N F O
Page 44
cas de um emulador da máquina.
Assim a área de trabalho fica com
a cara de micro de mão ou de ce-
lular, o que ajuda na visualização
do conteúdo a ser desenvolvido.
> Fireworks MX 2004
No editor de imagens da suíte, o
Fireworks MX 2004, a palavra-cha-
ve são as ferramentas de trabalho
colaborativo e a integração com o
programa principal, o Dreamwea-
ver. O Fireworks suporta os mes-
mos esquemas de travamento das
imagens PNG, para evitar que mais
de um integrante da equipe traba-
lhe com o mesmo arquivo. O avan-
ço da integração é patente. Quan-
do o Dreamweaver edita imagens
diretamente, na verdade está usan-
do recursos do Fireworks.
TUTORIAL/PORTAL 23.05.05 16:56 Page 45
MONTE O SITE
RAPIDINHO
COM O PHP-NUKE, DÁ PARA CRIAR UM PORTAL COM ALTA
DOSE DE INTERATIVIDADE EM POUCO TEMPO
POR AIRTON LOPES, COM OSMAR LAZARINI
versatilidade é a me-
A lhor das característi-
cas do PHP-Nuke, um
sistema de gerencia-
mento de conteúdo que vem ga-
nhando destaque entre os desen-
volvedores de sites dinâmicos. Em
um único local, o administrador
do site consegue controlar as di-
versas funções presentes na ins-
talação-padrão do PHP-Nuke e os
seus numerosos módulos adicio-
nais. O cardápio de recursos inte-
rativos inclui fóruns, mensagens
privadas, enquetes, newsletters e
ferramenta de busca. Tudo é con-
figurado por meio de uma inter-
face simples e intuitiva.
O requisito fundamental para
montar um portal recheado de re-
cursos interativos é um servidor
com o PHP-Nuke, o Apache com
suporte ao PHP e o MySQL insta-
lados. Essa máquina pode ser qual-
quer micro com banda larga ou um
host com suporte a PHP-Nuke. Nes-
te tutorial, vamos hospedar o site
localmente. Para quem preferir pa-
gar a hospedagem e se livrar da
administração do servidor, ao tér-
TUTORIAL/PORTAL
mino do processo, basta fazer o
upload do site para o host escolhi-
do. Só é preciso ficar atento se o
serviço e o plano contratados ofe-
recem suporte ao PHP-Nuke.
1. Prepare a base
O primeiro passo é instalar o Apa-
che com suporte a PHP e MySQL,
tarefa que pode ser feita numa úni-
ca tacada com o PHPTriad (www.
info.abril.com.br/download/
3170.shtml). O pacote reúne os
três aplicativos e ferramentas ad-
ministrativas, como o phpMyAd-
min. É só executar o arquivo do
PHPTriad para instalar cada pro-
grama na sua respectiva pasta-pa-
drão. Reinicie o computador e lo-
calize o grupo de atalhos do
PHPTriad no menu Iniciar do Win-
dows. No subgrupo MySQL, clique
em MySQL-D para ativar o aplica-
tivo. Em seguida, acione o Apache,
por meio do ícone Start Apache,
dentro do subgrupo Apache. A ja-
nela do prompt com a mensagem
“Apache is running” é o sinal de
que o web server está rodando e
pronto para a luta.
C O L E Ç Ã O I N F O > 45
TUTORIAL/PORTAL 23.05.05 16:57
TUTORIAL/PORTAL
2. A vez do PHP-Nuke
Preliminares concluídas, é hora de
mergulhar no PHP-Nuke (www.info.
abril.com.br/download/3667.
shtml). A versão utilizada é a 7.6. Fa-
ça a extração numa pasta de sua pre-
ferência. O conteúdo traz os scripts
para gerar as tabelas no MySQL, ar-
quivos de ajuda e uma pasta chama-
da HTML, com todos os arquivos que
serão usados no site.
3. O banco de dados
Com o Apache rodando, digite no
navegador o endereço http://
localhost/phpmyadmin para en-
trar na página de administração
dos dados do MySQL por meio do
phpMyAdmin. No campo Cria No-
vo Banco de Dados, digite um no-
me, como INFOLAB. Está criado
um banco de dados vazio. Na te-
la seguinte você irá rodar o script
para gerar as tabelas do banco de
dados INFOLAB.
Pressione o botão
Procurar, vá até o
diretório no qual
foram extraídos os
arquivos do PHP-
Nuke, abra a pas-
ta SQL e clique
duas vezes sobre
o arquivo nuke.sql.
Na seqüência, fi-
nalize a operação
clicando no bo-
tão Executa. Pron-
to, estão criadas
as tabelas. phpMyAdmin: para criar as tabelas do banco de dados
46 < C O L E Ç Ã O I N F O
Page 46
4. O nome do portal
Agora, copie todos os arquivos da
pasta HTML, extraída durante a ins-
talação do PHP-Nuke, e cole no dire-
tório C:\Apache\htdocs ou em uma
subpasta que você pode criar com o
nome do portal. Assim, o endereço
do seu site PHP-Nuke ficará sendo
http://localhost/nome-do-portal/.
5. A hospedagem
Entre os arquivos copiados da pas-
ta HTML está o config.php, que de-
ve ser aberto e editado no Bloco
de notas do Windows ou qualquer
processador de texto. A variável
$dbhost traz o valor “localhost”.
Como vamos hospedar o site PHP-
Nuke localmente, deixe como está.
Para quem preferir recorrer a um
provedor de hospedagem, será pre-
ciso substituir o valor das variáveis
com as informações fornecidas pe-
lo serviço contratado. Em $dbpass,
PHP-Nuke: Menu de Administração traz todos os recursos da tela, surgem os
insira logo à frente da variável uma
palavra para servir de senha. O no-
me escolhido anteriormente para
o banco de dados (no nosso caso,
INFOLAB) deve ser digitado na va-
riável $dbname. Os campos depois
de editados devem ficar assim:
$dbhost = “localhost”;
$dbuname = “root”;
$dbpass = “senha”;
$dbname = “INFOLAB”;
$prefix = “nuke”;
$user_prefix = “nuke”;
$dbtype = “MySQL”;
$sitekey = “SdFk*fa28367-dm56
w69.3a2fDS+e9”; $gfx_chk = 7;
6. O visual
Concluída a etapa de criação e con-
figuração do banco de dados, todo
o trabalho passa a ser feito na
interface de administração do
PHP-Nuke, no endereço http://
localhost/nome-do-portal/admin.
php. É o local no qual serão defi-
TUTORIAL/PORTAL
nidos o layout, os
recursos interativos
e o conteúdo do
portal. Assim que
você entrar pela
primeira vez no en-
dereço, será preci-
so criar uma conta
de administrador,
fornecendo login e
senha. Clicando no
ícone Preferências,
na parte de baixo
campos para inse-
rir as informações gerais (como o
nome do site e a URL) e escolher
o visual do portal. No campo Te-
mas, há um menu com diversas
opções pré-instaladas. Além des-
sas, o PHP-Nuke pode receber ou-
tros temas criados pelo usuário ou
baixados pela web. Para dar um
toque mais pessoal, é interessan-
te substituir o logo-padrão por um
logotipo ou imagem personaliza-
da. Para que o seu próprio logo
apareça no menu de opções, é pre-
ciso que o arquivo GIF correspon-
dente esteja armazenado na pas-
ta de imagens do tema escolhido
e nomeado como logo.gif, substi-
tuindo o original. O caminho para
a pasta é C:\Apache\htdocs\nome-
d o - p o r t a l \t h e m e s\ n o m e - d o -
tema\images. Não se esqueça tam-
bém de selecionar o idioma e in-
dicar o formato para o horário lo-
cal, digitando pt-br. Role a tela até
o final e salve as alterações.
C O L E Ç Ã O I N F O > 47
TUTORIAL/PORTAL 23.05.05 16:57
TUTORIAL/PORTAL
2. A vez do PHP-Nuke
Preliminares concluídas, é hora de
mergulhar no PHP-Nuke (www.info.
abril.com.br/download/3667.
shtml). A versão utilizada é a 7.6. Fa-
ça a extração numa pasta de sua pre-
ferência. O conteúdo traz os scripts
para gerar as tabelas no MySQL, ar-
quivos de ajuda e uma pasta chama-
da HTML, com todos os arquivos que
serão usados no site.
3. O banco de dados
Com o Apache rodando, digite no
navegador o endereço http://
localhost/phpmyadmin para en-
trar na página de administração
dos dados do MySQL por meio do
phpMyAdmin. No campo Cria No-
vo Banco de Dados, digite um no-
me, como INFOLAB. Está criado
um banco de dados vazio. Na te-
la seguinte você irá rodar o script
para gerar as tabelas do banco de
dados INFOLAB.
Pressione o botão
Procurar, vá até o
diretório no qual
foram extraídos os
arquivos do PHP-
Nuke, abra a pas-
ta SQL e clique
duas vezes sobre
o arquivo nuke.sql.
Na seqüência, fi-
nalize a operação
clicando no bo-
tão Executa. Pron-
to, estão criadas
as tabelas. phpMyAdmin: para criar as tabelas do banco de dados
46 < C O L E Ç Ã O I N F O
Page 46
4. O nome do portal
Agora, copie todos os arquivos da
pasta HTML, extraída durante a ins-
talação do PHP-Nuke, e cole no dire-
tório C:\Apache\htdocs ou em uma
subpasta que você pode criar com o
nome do portal. Assim, o endereço
do seu site PHP-Nuke ficará sendo
http://localhost/nome-do-portal/.
5. A hospedagem
Entre os arquivos copiados da pas-
ta HTML está o config.php, que de-
ve ser aberto e editado no Bloco
de notas do Windows ou qualquer
processador de texto. A variável
$dbhost traz o valor “localhost”.
Como vamos hospedar o site PHP-
Nuke localmente, deixe como está.
Para quem preferir recorrer a um
provedor de hospedagem, será pre-
ciso substituir o valor das variáveis
com as informações fornecidas pe-
lo serviço contratado. Em $dbpass,
PHP-Nuke: Menu de Administração traz todos os recursos da tela, surgem os
insira logo à frente da variável uma
palavra para servir de senha. O no-
me escolhido anteriormente para
o banco de dados (no nosso caso,
INFOLAB) deve ser digitado na va-
riável $dbname. Os campos depois
de editados devem ficar assim:
$dbhost = “localhost”;
$dbuname = “root”;
$dbpass = “senha”;
$dbname = “INFOLAB”;
$prefix = “nuke”;
$user_prefix = “nuke”;
$dbtype = “MySQL”;
$sitekey = “SdFk*fa28367-dm56
w69.3a2fDS+e9”; $gfx_chk = 7;
6. O visual
Concluída a etapa de criação e con-
figuração do banco de dados, todo
o trabalho passa a ser feito na
interface de administração do
PHP-Nuke, no endereço http://
localhost/nome-do-portal/admin.
php. É o local no qual serão defi-
TUTORIAL/PORTAL
nidos o layout, os
recursos interativos
e o conteúdo do
portal. Assim que
você entrar pela
primeira vez no en-
dereço, será preci-
so criar uma conta
de administrador,
fornecendo login e
senha. Clicando no
ícone Preferências,
na parte de baixo
campos para inse-
rir as informações gerais (como o
nome do site e a URL) e escolher
o visual do portal. No campo Te-
mas, há um menu com diversas
opções pré-instaladas. Além des-
sas, o PHP-Nuke pode receber ou-
tros temas criados pelo usuário ou
baixados pela web. Para dar um
toque mais pessoal, é interessan-
te substituir o logo-padrão por um
logotipo ou imagem personaliza-
da. Para que o seu próprio logo
apareça no menu de opções, é pre-
ciso que o arquivo GIF correspon-
dente esteja armazenado na pas-
ta de imagens do tema escolhido
e nomeado como logo.gif, substi-
tuindo o original. O caminho para
a pasta é C:\Apache\htdocs\nome-
d o - p o r t a l \t h e m e s\ n o m e - d o -
tema\images. Não se esqueça tam-
bém de selecionar o idioma e in-
dicar o formato para o horário lo-
cal, digitando pt-br. Role a tela até
o final e salve as alterações.
C O L E Ç Ã O I N F O > 47
TUTORIAL/PORTAL 23.05.05 16:59 Page 48
TUTORIAL/PORTAL
7. Os módulos
De volta à página de administração,
entre em Módulos para ativar os mó-
dulos a serem adotados no portal.
Será exibida uma grande tabela, com
colunas para os recursos, os respec-
tivos status (ativo ou inativo) e fun-
ções (editar, ativar e colocar na ho-
me). Para citar apenas alguns dos
recursos mais bacanas, dá para in-
cluir ferramenta de busca (Search),
montar fóruns (Forum), implemen-
tar um serviço de troca de mensa-
gens particulares entre os usuários
registrados (Private Messages) e con-
trolar todas as estatísticas de aces-
so (Statistics). A forma de editar ca-
da um dos módulos é a mesma. Com
um clique sobre o recurso deseja-
do, surgem embaixo da tela os cam-
pos a serem editados. É preciso de-
terminar se o nome de exibição do
módulo será alterado. O link para o
serviço de mensagens privadas (Pri-
vate Messages) pode aparecer co-
mo Comunique-se, por exemplo. No
item seguinte, esco-
lha quais usuários
terão acesso ao re-
curso, que pode es-
tar liberado para to-
dos os visitantes, só
para visitantes ca-
dastrados ou restri-
to aos administrado-
res. Feitas as altera-
ções, não se esque-
ça de salvar tudo, re-
tornando à tela de
administração. Portal: página inicial com notícias, enquete, busca etc
48 < C O L E Ç Ã O I N F O
8. Os blocos
Os sites produzidos com o PHP-
Nuke têm uma estrutura caracte-
rística. Normalmente a página é for-
mada por três blocos. Os dois late-
rais são mais estreitos e trazem me-
nus e atalhos para o restante do si-
te. Já o central mostra o conteúdo
principal. Entrando em Blocos, é
possível escolher a posição que os
menus e módulos irão ocupar den-
tro desses blocos.
9. O conteúdo
Agora que a estrutura, os recursos
e o visual do portal estão defini-
dos, está chegando o momento de
alimentar as páginas com conteú-
do. Porém, é aconselhável fazê-lo
de forma organizada, trabalhando
com tópicos, que servirão para
agrupar textos sobre assuntos cor-
relatos. Na tela de administração,
clique em Tópicos. O processo de
criação de tópicos consiste basica-
mente em indicar o nome do tópi-
co e a imagem que irá aparecer
junto com a notícia. Para inserir a
imagem, é preciso que o arquivo
esteja no interior do diretório de
imagens dos tópicos, que fica em
C : \ A p a c h e\ h t d o c s\ n o m e - d o -
portal\images\topics. Caso con-
trário, ela não aparecerá no me-
nuzinho de imagens do gerencia-
dor de tópicos. Fique atento tam-
bém às dimensões da imagem,
pois ela é exibida em tamanho
real. Assim, uma imagem muito
larga ou alta pode acabar com o
design da página. Se tudo estiver
de acordo, salve as alterações.
10. Os textos
Finalmente é hora de inserir os
textos. Clique no ícone Adicionar
notícias. Dentro do gerenciador,
escreva o título da notícia, esco-
lha um tópico e marque a opção
para publicar na home. Se quiser
abrir espaço para os visitantes do
site comentarem a notícia, habili-
te a opção Ativar Comentários Pa-
ra esta Notícia. Na caixa Texto da
Notícia, digite ou cole o conteú-
do. Logo abaixo há outro campo,
chamado Texto Estendido. Ele é
uma ótima opção para a publica-
ção de textos longos. Para tanto,
digite apenas o trecho inicial do
texto no campo Texto da Notícia
e o restante em Texto Estendido.
Dessa forma, a home trará ape-
nas um aperitivo da notícia e um
link para a página com o texto in-
tegral. A única coisa chata é que
TUTORIAL/PORTAL
as quebras de linha têm de ser fei-
tas manualmente, com os manja-
dos comandos <br> (quebra) e <p>
(parágrafo) do HTML. Em compen-
sação, o uso do HTML na caixa de
textos abre a possibilidade de in-
serir fotos, animações em Flash
etc. Só é preciso escrever o co-
mando com o caminho para o ar-
quivo. Terminada a operação, não
se esqueça de salvar o trabalho.
11. O acesso
Com o site concluído numa máqui-
na com acesso em banda larga e
endereço IP fixo, ele poderá ser
acessado por uma URL que traz o
número do IP e o nome do portal,
algo como http://200.xxx.xxx.
xxx/nome-do-portal.
Caso você resolva deixar o site
em um host remoto, o processo
não é complicado. Primeiramen-
te, edite o arquivo config.php com
as informações fornecidas pelo
serviço de hospedagem. Na tela
de administração do seu PHP-
Nuke local, entre em Backup e sal-
ve o arquivo. Depois, envie o ar-
quivo por FTP para o servidor jun-
to com toda a árvore de diretórios
do portal. Ao configurar o banco
de dados no novo servidor, na ho-
ra de rodar o script para a criação
de tabelas, será preciso apenas
executar o arquivo salvo como
backup para instalar o site exata-
mente como ele havia sido pro-
duzido no computador da sua ca-
sa ou do seu escritório.
C O L E Ç Ã O I N F O > 49
TUTORIAL/PORTAL 23.05.05 16:59 Page 48
TUTORIAL/PORTAL
7. Os módulos
De volta à página de administração,
entre em Módulos para ativar os mó-
dulos a serem adotados no portal.
Será exibida uma grande tabela, com
colunas para os recursos, os respec-
tivos status (ativo ou inativo) e fun-
ções (editar, ativar e colocar na ho-
me). Para citar apenas alguns dos
recursos mais bacanas, dá para in-
cluir ferramenta de busca (Search),
montar fóruns (Forum), implemen-
tar um serviço de troca de mensa-
gens particulares entre os usuários
registrados (Private Messages) e con-
trolar todas as estatísticas de aces-
so (Statistics). A forma de editar ca-
da um dos módulos é a mesma. Com
um clique sobre o recurso deseja-
do, surgem embaixo da tela os cam-
pos a serem editados. É preciso de-
terminar se o nome de exibição do
módulo será alterado. O link para o
serviço de mensagens privadas (Pri-
vate Messages) pode aparecer co-
mo Comunique-se, por exemplo. No
item seguinte, esco-
lha quais usuários
terão acesso ao re-
curso, que pode es-
tar liberado para to-
dos os visitantes, só
para visitantes ca-
dastrados ou restri-
to aos administrado-
res. Feitas as altera-
ções, não se esque-
ça de salvar tudo, re-
tornando à tela de
administração. Portal: página inicial com notícias, enquete, busca etc
48 < C O L E Ç Ã O I N F O
8. Os blocos
Os sites produzidos com o PHP-
Nuke têm uma estrutura caracte-
rística. Normalmente a página é for-
mada por três blocos. Os dois late-
rais são mais estreitos e trazem me-
nus e atalhos para o restante do si-
te. Já o central mostra o conteúdo
principal. Entrando em Blocos, é
possível escolher a posição que os
menus e módulos irão ocupar den-
tro desses blocos.
9. O conteúdo
Agora que a estrutura, os recursos
e o visual do portal estão defini-
dos, está chegando o momento de
alimentar as páginas com conteú-
do. Porém, é aconselhável fazê-lo
de forma organizada, trabalhando
com tópicos, que servirão para
agrupar textos sobre assuntos cor-
relatos. Na tela de administração,
clique em Tópicos. O processo de
criação de tópicos consiste basica-
mente em indicar o nome do tópi-
co e a imagem que irá aparecer
junto com a notícia. Para inserir a
imagem, é preciso que o arquivo
esteja no interior do diretório de
imagens dos tópicos, que fica em
C : \ A p a c h e\ h t d o c s\ n o m e - d o -
portal\images\topics. Caso con-
trário, ela não aparecerá no me-
nuzinho de imagens do gerencia-
dor de tópicos. Fique atento tam-
bém às dimensões da imagem,
pois ela é exibida em tamanho
real. Assim, uma imagem muito
larga ou alta pode acabar com o
design da página. Se tudo estiver
de acordo, salve as alterações.
10. Os textos
Finalmente é hora de inserir os
textos. Clique no ícone Adicionar
notícias. Dentro do gerenciador,
escreva o título da notícia, esco-
lha um tópico e marque a opção
para publicar na home. Se quiser
abrir espaço para os visitantes do
site comentarem a notícia, habili-
te a opção Ativar Comentários Pa-
ra esta Notícia. Na caixa Texto da
Notícia, digite ou cole o conteú-
do. Logo abaixo há outro campo,
chamado Texto Estendido. Ele é
uma ótima opção para a publica-
ção de textos longos. Para tanto,
digite apenas o trecho inicial do
texto no campo Texto da Notícia
e o restante em Texto Estendido.
Dessa forma, a home trará ape-
nas um aperitivo da notícia e um
link para a página com o texto in-
tegral. A única coisa chata é que
TUTORIAL/PORTAL
as quebras de linha têm de ser fei-
tas manualmente, com os manja-
dos comandos <br> (quebra) e <p>
(parágrafo) do HTML. Em compen-
sação, o uso do HTML na caixa de
textos abre a possibilidade de in-
serir fotos, animações em Flash
etc. Só é preciso escrever o co-
mando com o caminho para o ar-
quivo. Terminada a operação, não
se esqueça de salvar o trabalho.
11. O acesso
Com o site concluído numa máqui-
na com acesso em banda larga e
endereço IP fixo, ele poderá ser
acessado por uma URL que traz o
número do IP e o nome do portal,
algo como http://200.xxx.xxx.
xxx/nome-do-portal.
Caso você resolva deixar o site
em um host remoto, o processo
não é complicado. Primeiramen-
te, edite o arquivo config.php com
as informações fornecidas pelo
serviço de hospedagem. Na tela
de administração do seu PHP-
Nuke local, entre em Backup e sal-
ve o arquivo. Depois, envie o ar-
quivo por FTP para o servidor jun-
to com toda a árvore de diretórios
do portal. Ao configurar o banco
de dados no novo servidor, na ho-
ra de rodar o script para a criação
de tabelas, será preciso apenas
executar o arquivo salvo como
backup para instalar o site exata-
mente como ele havia sido pro-
duzido no computador da sua ca-
sa ou do seu escritório.
C O L E Ç Ã O I N F O > 49
TUTORIAL/SITE DE EMPRESA 23.05.05 17:08 Page 50

TUTORIAL/SITE DE EMPRESA

PÁGINA DINÂMICA
SEMPROGRAMAR
O FULLXML DISPENSA LINHAS DE CÓDIGO E BANCO
DE DADOS NA CRIAÇÃO DE SITES INTERATIVOS
POR CARLOS MACHADO

sonho de quem gosta de Neste tutorial, vamos fazer uma ins-

O inventar na internet, mas

odeia programar, é po-
der criar websites dinâ-
micos sem escrever uma linha de có-
digo. E essa possibilidade existe. Com
o Fullxml, dá para montar e adminis-
trar sites interativos, com fóruns, en-
quetes, livro de visitas e cadastro de
usuários, tudo com XML e ASP. O me-
lhor da história é que o programa, de-
senvolvido por um francês chamado
John Roland, é de código aberto. Ve-
ja, a seguir, como obter essa ferra-
menta e montar um site com ela.
talação no Windows XP Professio-
nal. Lembre-se: o site, ao ser colo-
cado na web, só poderá ser hospe-
dado num ambiente que dê supor-
te às tecnologias ASP e XML.
2. INSTALAÇÃO
Faça o download do Fullxml (www.
info.abril.com.br/download/3836.
shtml) e do MSXML 4.0 (www.info.
abril.com. br/download/3838.shtml).
Agora, no Windows XP Professional,
instale o IIS. Para isso, no Painel de
Controle, abra o item Adicionar ou Re-

1. PRÉ-REQUISITOS
Para usar o Fullxml, é ne-
cessário ter um micro
com o Windows e o ser-
vidor web Internet Infor-
mation Services (IIS). Es-
se recurso vem como pa-
drão no Windows XP Pro-
fessional, no Windows
2000 e no Windows Ser-
ver 2003. Também é pre-
ciso instalar o MSXML 4.0
— os componentes bási-
cos da linguagem XML. Ensaio de site: página com menus, enquetes e notícias

50 < C O L E Ç Ã O I N F O
TUTORIAL/SITE DE EMPRESA 23.05.05 17:09 Page 51

TUTORIAL/SITE DE EMPRESA

mover Programas. Clique

em Adicionar/Remover
Componentes do Win-
dows. No Assistente de
Componentes, marque a
linha Internet Information
Services (IIS) e avance.
Agora, instale o MSXML
4.0 e, por fim, o Fullxml.
Ao ser ativado no Win-
dows, o IIS cria a pasta
Inetpub, que é o centro
de serviços de internet,
e dentro dela o subdire- Configurações: aqui definem-se os recursos do site
tório wwwroot, a raiz do
servidor web. Nessa pasta, crie uma Engine. Mas, ao contrário, na pasta
subpasta chamada fullxml. O progra- db desligue a permissão Ler. Ou seja,
ma Fullxml vem num pacote ZIP. Ex- essa será uma pasta reservada: o usuá-
traia o conteúdo desse arquivo, man- rio não terá direito de fazer nada aí.
tendo os diretórios, na pasta fullxml. Agora, abra o browser e digite:
http://localhost/fullxml. Pronto: aí
3. AJUSTE AS PERMISSÕES está o embrião de seu site. Agora, é
Para que os administradores e usuá- preciso configurá-lo, dando os seus
rios do site possam utilizar adequa- toques pessoais.
damente o Fullxml, é preciso ainda
fazer um ajuste nos diretórios, usan- 4. CONFIGURAÇÃO DO SITE
do o console de administração do IIS. A estrutura do site é bem parecida
No Painel de Controle, acione Desem- com a de boa parte das páginas que
penho e Manutenção/Ferramentas você conhece. Acesse a interface de
Administrativas/Internet Information gerenciamento do Fullxml. Para is-
Services. Surge o console do IIS. Abra so, no quadro Login, digite o nome
a pasta Sites da Web e, depois, a sub- (full) e a senha-padrão (xml). No me-
pasta Site da Web Padrão. Lá dentro nu de administração, clique em Set-
está o diretório fullxml. Este, por sua tings. Nessa página você define as
vez, tem várias pastas. Clique com o informações básicas do site. Antes
botão direito na pasta Media e esco- de tudo, vamos fazê-lo falar a nos-
lha Propriedades. Na orelha Diretó- sa língua. Na caixa Language, esco-
rio, marque a opção Gravar. Isso per- lha Brazilian Portuguese. Na linha
mite que o usuário salve arquivos nes- Encoding, escolha iso-8859-1. Cli-
se diretório. Faça o mesmo na pasta que OK no final da página.

C O L E Ç Ã O I N F O > 51
TUTORIAL/SITE DE EMPRESA 23.05.05
TUTORIAL/SITE DE EMPRESA
Agora, na página em português, fa-
ça um ajuste de segurança. Clique no
menu Moderação/Membros. Surge a
lista de usuários cadastrados. Lá es-
tá o usuário full — a identidade com
a qual você acessou o gerenciamen-
to do site. Acione o botão Criar e
preencha os campos Apelido e Se-
nha. Em Grupo, escolha Administra-
dor. Somente administradores podem
alterar a estrutura do site. Dê OK e,
de volta à lista de usuários, clique no
apelido full e, na tela seguinte, acio-
ne Deletar. O usuário-padrão desapa-
receu (e você, que era ele, não está
mais logado). Para continuar, aponte
o browser para a página inicial:
http://localhost/fullxml. Nela, en-
tre como o usuário que você criou.
Retorne ao menu Principal/Confi-
gurações. Preencha os campos. A cai-
xa Aparência oferece 20 skins, ou te-
mas, para o site. Escolha um diferen-
te do padrão inicial, e clique em OK.
Em seguida, na mesma página do
Gerenciador: a administração é feita de qualquer lugar
52 < C O L E Ç Ã O I N F O
17:09 Page 52
browser, encurte o endereço para a
raiz do site: http://localhost/
fullxml. Confira: o site mudou de ca-
ra. Os blocos de opções nos itens
Status de Moderação e Lista de Re-
cursos permitem que você escolha
as funções que deseja habilitar. Em
todos os casos, as opções são On/Off.
Você vai querer fóruns? Vai colocar
arquivos para download?
5. DEFINA O CONTEÚDO
Seu site já está de pé. Falta agregar
conteúdo. Clique em Principal/Pági-
nas para adicionar páginas. Nessa te-
la, clique em Criar e digite o conteú-
do. Para que a página entre no ar, es-
colha Sim na linha Publicação. Se vo-
cê definir uma data de expiração, ela
ficará no ar até essa data. A opção
Conteúdos, no menu Principal, exi-
be todas as páginas do site. Impor-
tante: quando o administrador aces-
sa a página, ela exibe um quadrado
no título de cada item. Clique nele
para editar o item. O me-
nu Recursos permite criar
e administrar opções co-
mo enquetes, fóruns e
banners. O gerador de en-
quetes é superfácil de
usar. Clique em Enque-
tes/Criar. Digite as per-
guntas e dê OK. A apura-
ção é automática. Os tex-
tos aceitam tags HTML e
o programa até traz um
pequeno editor. Para abri-
lo, digite Ctrl+T quando
estiver escrevendo.
TUTORIAL/LAYOUT 23.05.05 18:04 Page 53
ADEUS, TABELAS
DE HTML
O PADRÃO CSS DEFINE O LAYOUT DO SITE, DEIXA
A PÁGINA LEVE E RÁPIDA DE CARREGAR
POR ANDRÉ CARDOZO
sar as tradicionais ta-
U belas de HTML para se-
parar as áreas de uma
página está virando
uma solução antiquada. Cada vez
mais, os webmasters utilizam o pa-
drão CSS (Cascading Style Sheets)
para definir o layout do site no lu-
gar das tabelas. A substituição se
justifica — uma página de 60 KB
com tabelas emagrece para coisa
de 4 KB com CSS, reduzindo o tem-
po de carregamento e o consumo
de banda. Assim, essa tecnologia,
que há cerca de dois anos era usa-
da basicamente para configurar
CSS no IE: boa distribuição das quatro áreas do layout
TUTORIAL/LAYOUT
fontes e fundos de página, inaugu-
rou a era tableless nos websites de
todos os portes.
A adoção do CSS não aconteceu
antes porque o suporte dos browsers
a essa tecnologia ainda começava.
Mas os navegadores atuais, como In-
ternet Explorer 6.0, Firefox 1.0.4 e
Opera 7 e 8, interpretam o padrão
com poucas diferenças (veja telas), o
que permite utilizá-lo com precisão.
Neste tutorial, vamos criar o lay-
out de um site substituindo o co-
mando “table” do HTML por um
conjunto de recursos do CSS co-
nhecido como CSS-P (Cascading
Style Sheets Positio-
ning). A principal
vantagem desse mé-
todo é que todo o
layout fica num ar-
quivo separado que
vale para o site intei-
ro e só é carregado
uma vez pelo nave-
gador. Isso evita a re-
petição de tags nas
páginas e permite al-
terações mais rápi-
das no visual do site.
C O L E Ç Ã O I N F O > 53
TUTORIAL/LAYOUT 23.05.05 18:05
TUTORIAL/LAYOUT
Escolhemos um
layout com quatro
áreas: cabeçalho ho-
rizontal (onde nor-
malmente entram lo-
gotipo e banner), co-
luna esquerda (me-
nu de navegação
principal), coluna
central (área de con-
teúdo e destaques) e
coluna direita (nave-
gação secundária, CSS no Firefox: leitura altera o título e a coluna à direita
links para parceiros
etc.). O arquivo pronto está dispo-
nível para download no endereço
www.info.abril.com.br/download/
3466.shtml.
1. O HTML
O primeiro passo é criar o arquivo
HTML. Dentro do comando “head”,
é necessário escrever a seguinte tag: temos no arquivo HTML os quatro
<link rel=“stylesheet” href=”
estilo. css“type=”text/ css”>
Ela indica ao browser qual é a
folha de estilo que deve ser toma-
do como referência para o layout
(neste caso, “estilo.css”). No corpo ainda não estão em suas devidas
do arquivo HTML temos quatro blo-
cos que definem as áreas:
<div id=“topo”>conteúdo do
cabeçalho </div>
<div id=“esquerda”>conteúdo
da coluna esquerda</div>
<div id=“meio”>conteúdo da
coluna central</div>
<div id=“direita”>conteúdo da
coluna direita</div>
A tag “div” serve como depósito
54 < C O L E Ç Ã O I N F O
Page 54
TUTORIAL/LAYOUT
#topo {
margin: 5px;
height: 80px;
background: silver;
}
#esquerda {
position: absolute;
top: 105px;
left: 10px;
width: 150px;
background: silver;
}
#meio {
CSS no Opera: diferença de leitura na coluna à direita
margin-left: 170px;
de conteúdo, criando camadas que margin-right: 220px; O primeiro bloco de comandos
podem ser manipuladas separada- background: silver; se refere ao cabeçalho. Os elemen-
mente. Dentro desse depósito, po- } tos “margin” e “height” definem,
demos usar normalmente todos os #direita { respectivamente, a margem e a al-
comandos HTML. position: absolute; tura em pixels. O atributo “back-
Note que cada “div” possui um top: 105px; ground” determina a cor de fundo,
atributo “id” distinto, que define right: 10px; mas é opcional e foi incluído ape-
todas as áreas do layout. Assim, já width: 200px; nas para facilitar a visualização.
background: silver; A seguir, definimos as três colu-
blocos de conteúdo. Salve o arqui- } nas do layout. O bloco da esquer-
vo e teste no browser.
2.A FOLHA DE ESTILO VALIDE SUA PÁGINA
Por enquanto, as áreas do layout O tableless já faz parte do Para seguir os padrões à
conjunto de padrões da web, risca, verifique se a página
posições e são exibidas uma abai- especificados pelo W3C que você criou está correta,
xo da outra. Isso ocorre porque não (www.w3c.org), o consórcio utilizando o serviço W3C
criamos o documento CSS, que é o que dita as regras Markup Validation Services,
responsável por definir a posição tecnológicas da grande rede. um validador de HTML
de cada bloco na página. Esse se- Por isso mesmo, a tendência gratuito disponível no
rá nosso próximo passo. é de aumentar a endereço validator.w3.org.
A folha de estilo nada mais é do compatibilidade do padrão Basta postar o endereço de
que um arquivo em texto puro com entre os navegadores e sua página, que o serviço
a extensão CSS. Abrimos então o acelerar o tempo de mostrará as tags que
Bloco de Notas do Windows e es- renderização das páginas. apresentam erros.
crevemos os seguintes comandos:
C O L E Ç Ã O I N F O > 55
TUTORIAL/LAYOUT 23.05.05 18:05
TUTORIAL/LAYOUT
Escolhemos um
layout com quatro
áreas: cabeçalho ho-
rizontal (onde nor-
malmente entram lo-
gotipo e banner), co-
luna esquerda (me-
nu de navegação
principal), coluna
central (área de con-
teúdo e destaques) e
coluna direita (nave-
gação secundária, CSS no Firefox: leitura altera o título e a coluna à direita
links para parceiros
etc.). O arquivo pronto está dispo-
nível para download no endereço
www.info.abril.com.br/download/
3466.shtml.
1. O HTML
O primeiro passo é criar o arquivo
HTML. Dentro do comando “head”,
é necessário escrever a seguinte tag: temos no arquivo HTML os quatro
<link rel=“stylesheet” href=”
estilo. css“type=”text/ css”>
Ela indica ao browser qual é a
folha de estilo que deve ser toma-
do como referência para o layout
(neste caso, “estilo.css”). No corpo ainda não estão em suas devidas
do arquivo HTML temos quatro blo-
cos que definem as áreas:
<div id=“topo”>conteúdo do
cabeçalho </div>
<div id=“esquerda”>conteúdo
da coluna esquerda</div>
<div id=“meio”>conteúdo da
coluna central</div>
<div id=“direita”>conteúdo da
coluna direita</div>
A tag “div” serve como depósito
54 < C O L E Ç Ã O I N F O
Page 54
TUTORIAL/LAYOUT
#topo {
margin: 5px;
height: 80px;
background: silver;
}
#esquerda {
position: absolute;
top: 105px;
left: 10px;
width: 150px;
background: silver;
}
#meio {
CSS no Opera: diferença de leitura na coluna à direita
margin-left: 170px;
de conteúdo, criando camadas que margin-right: 220px; O primeiro bloco de comandos
podem ser manipuladas separada- background: silver; se refere ao cabeçalho. Os elemen-
mente. Dentro desse depósito, po- } tos “margin” e “height” definem,
demos usar normalmente todos os #direita { respectivamente, a margem e a al-
comandos HTML. position: absolute; tura em pixels. O atributo “back-
Note que cada “div” possui um top: 105px; ground” determina a cor de fundo,
atributo “id” distinto, que define right: 10px; mas é opcional e foi incluído ape-
todas as áreas do layout. Assim, já width: 200px; nas para facilitar a visualização.
background: silver; A seguir, definimos as três colu-
blocos de conteúdo. Salve o arqui- } nas do layout. O bloco da esquer-
vo e teste no browser.
2.A FOLHA DE ESTILO VALIDE SUA PÁGINA
Por enquanto, as áreas do layout O tableless já faz parte do Para seguir os padrões à
conjunto de padrões da web, risca, verifique se a página
posições e são exibidas uma abai- especificados pelo W3C que você criou está correta,
xo da outra. Isso ocorre porque não (www.w3c.org), o consórcio utilizando o serviço W3C
criamos o documento CSS, que é o que dita as regras Markup Validation Services,
responsável por definir a posição tecnológicas da grande rede. um validador de HTML
de cada bloco na página. Esse se- Por isso mesmo, a tendência gratuito disponível no
rá nosso próximo passo. é de aumentar a endereço validator.w3.org.
A folha de estilo nada mais é do compatibilidade do padrão Basta postar o endereço de
que um arquivo em texto puro com entre os navegadores e sua página, que o serviço
a extensão CSS. Abrimos então o acelerar o tempo de mostrará as tags que
Bloco de Notas do Windows e es- renderização das páginas. apresentam erros.
crevemos os seguintes comandos:
C O L E Ç Ã O I N F O > 55
TUTORIAL/LAYOUT 23.05.05 18:05 Page 56

TUTORIAL/LAYOUT

da, que abrigará o menu de nave- ra definida. Dessa forma, a área

gação, tem largura definida em pi-
xels. A linha “position: absolute”
permite que o webmaster determi-
ne a posição do bloco por meio de
coordenadas. Neste caso, ele está
a 105 pixels do topo e a 10 pixels
do lado esquerdo da página. Esse
procedimento vale também para a
coluna da direita.
3. A COLUNA DO MEIO
O pulo-do-gato está no código usa-
do na coluna do meio. Aqui, defi-
nimos apenas as margens esquer-
da e direita para evitar que a área
se sobreponha às outras. Observe
que, ao contrário dos blocos da es-
querda e da direita, não há largu-
central é ajustada automaticamen-
te, de acordo com o tamanho da
janela do internauta. Caso o usuá-
rio redimensione o browser, a pá-
gina será realinhada, evitando a
barra de rolagem na horizontal.
Salve o documento como “esti-
lo.css” no mesmo diretório do ar-
quivo HTML e faça o teste, redi-
mensionando a janela do browser.
Note que as áreas do topo e do
meio se adaptam ao novo tama-
nho, enquanto as colunas da es-
querda e da direita mantêm sua
largura. Pronto, nosso layout es-
tá terminado e agora é só escre-
ver uma carta de despedida sem
saudade para as tabelas HTML.

Mais sobre o CSS

Conheça outros comandos úteis em folhas de estilo
> Comando Função Exemplo
> background Define propriedades do background:
fundo, como cor ou imagem url(‘imagem/fundo.gif’)
> border Determina propriedades da border: solid 1px #000000
borda
> border-style Atribui o estilo à borda border-style: solid
> color Define cor da fonte ou do color: rgb(255,10,10)
elemento
> font Define propriedades da font: 10px verdana bold
fonte
> font-family Determina o tipo da fonte font-family: arial
> font-size Regula o tamanho da fonte font-size: large
> list-style Define propriedades dos list-style: disc inside
elementos <li>
> margin Cria espaço à volta do margin: 0px auto 0px 5px
elemento
> padding Define espaço entre o texto e padding: 10px
a borda
> text-align Define o alinhamento do text-align: justify
texto
Obs.: outros comandos você pode encontrar no endereço: www.w3schools.com/css.

56 < C O L E Ç Ã O I N F O
TUTORIAL/SERVIDOR DE BLOG 1 23.05.05 17:12
BLOG PRONTO
EM SEIS PASSOS
UM ROTEIRO PARA IMPLANTAR UM DIÁRIO EM SEU WEBSITE
COM O WORDPRESS
POR MAURÍCIO GREGO
uito mais que um diário
M de adolescente, o blog
pode ser um canal efi-
ciente e dinâmico para
divulgar notícias e interagir com as
pessoas. Uma equipe de desenvolvi-
mento de software, por exemplo, po-
de publicar nele dados sobre atuali-
zações que estão sendo realizadas.
Neste tutorial, vamos usar o Word-
Press, um servidor de blog gratuito e
de código-fonte aberto. Os requisitos
básicos para rodá-lo são o servidor
Apache, o interpretador de linguagem
PHP e o gerenciador de bancos de da-
dos MySQL. Esse trio de software faz
parte da maioria dos planos de hos-
pedagem em Linux oferecidos na in-
ternet. Vejamos os passos a seguir.
1. A BASE DE DADOS
A primeira coisa a fazer é criar um
banco de dados no MySQL para o
WordPress. Em geral, os provedores
de hospedagem oferecem alguma fer-
ramenta que possibilita gerenciar o
banco de dados. O INFOLAB usou o
phpMyAdmin. Na tela principal do
phpMyAdmin, digite um nome para
o novo banco e clique no botão Cria.
Page 57
TUTORIAL/SERVIDOR DE BLOG
No nosso exemplo, usamos o nome
wordpress. Vamos, agora, definir uma
conta de usuário no MySQL para o
WordPress. Volte à página principal
do phpMyAdmin e clique no link Pri-
vilégios. Em seguida, acione Adicio-
nar um Novo Usuário. No campo No-
me do Usuário, digite um nome. De-
pois, especifique uma senha de aces-
so. Na seção Global Privileges, clique
no link Marcar All. Clique no botão
Executa para criar a conta.
2. A PREPARAÇÃO
Faça o download do WordPress
(www.info.abril.com.br/download/
3949.shtml) e descompacte-o. Você
terá uma pasta chamada WordPress
com os arquivos. Abra, num editor de
textos, o wp-config-sample.php e pro-
cure por MySQL Settings. Nas três li-
nhas seguintes, coloque o nome do
banco de dados, o nome do usuário
e a senha que você definiu nos pas-
sos 1 e 2, como neste exemplo:
define('DB_NAME', 'wordpress');
define('DB_USER', 'infolab');
define('DB_PASSWORD', 'senha');
Na quarta linha dessa seção, indi-
que o servidor onde roda o MySQL.
C O L E Ç Ã O I N F O > 57
TUTORIAL/SERVIDOR DE BLOG 1 23.05.05
TUTORIAL/SERVIDOR DE BLOG
Na maioria dos provedores de hos-
pedagem, o MySQL e o Apache estão
no mesmo servidor. Nesse caso, o en-
dereço é localhost (se tiver dúvidas,
pergunte ao provedor), que é o pa-
drão do WordPress. Fica assim:
define('DB_HOST', 'localhost');
No final, salve esse arquivo com o
nome wp-config.php.
3. A INSTALAÇÃO
Vamos instalar o WordPress. Faça o
upload da pasta wordpress para o ser-
vidor. Abra o navegador e, na barra
de endereço, digite a URL do seu si-
te seguida de /wordpress/install.php,
como neste exemplo:
http://www.empresa.com.br/
wordpress/install.php
O WordPress inicia um script de
instalação, verifica qual a versão do
PHP no servidor e mostra uma men-
sagem. Se estiver tudo certo, clique
no link Let's Go. Na tela seguinte
(Step 1), o script configura a base de
dados no MySQL. Clique em Step 2
para avançar. O instala-
dor vai criar as tabelas
do blog. No campo no pé
da página, digite o en-
dereço do seu site, como:
http://www.empresa.
com.br/.
Na etapa seguinte (Step
3), o instalador gera uma
senha aleatória para o
usuário admin, o adminis-
trador. Anote-a. Com is-
so, concluímos a instala-
ção e o blog já pode ser WordPress: formulário para escrever e definir ações
58 < C O L E Ç Ã O I N F O
17:12 Page 58
visitado. O endereço é do tipo
www.empresa.com.br/wordpress.
4. OS AJUSTES BÁSICOS
Passemos para a configuração bási-
ca do WordPress. Na tela final do script
de instalação ou na própria página do
blog, clique no link Login. Na caixa de
autenticação, forneça o nome admin
e a senha que você anotou. Você vai
entrar no sistema de gerenciamento.
Também é possível chegar a ele na-
vegando até www.empresa.com.
br/wordpress/wp-login.php.
No menu na parte superior da te-
la, clique em Options. A aba General
deverá estar ativa. No campo Weblog
Title, digite um nome para o blog. Na
linha logo abaixo, ponha uma breve
descrição dele, como “Novidades do
software X”. No campo E-mail Address,
escreva seu endereço de e-mail. No
item Membership, assinale se você
quer que qualquer pessoa possa se
cadastrar como usuário e se qualquer
usuário pode publicar artigos.
Na seção Date and Ti-
me, digite -3 no campo
Times in the Weblog
Should Differ By (se o ho-
rário de verão estiver em
vigor, use -2). Assim, es-
tamos dizendo ao Word-
Press para empregar o
horário oficial brasileiro.
No campo Default Date
Format, digite j/n/Y pa-
ra exibir as datas no for-
mato dia/mês/ano. Em Teste de blog: página simples e fácil de navegar
Default Time Format, es-
creva G:i. Assim, os horários serão
exibidos na forma horas:minutos,
com contagem de 24 horas. Quando
terminar, clique no botão Update Op-
tions. Se quiser ver como ficou o blog,
clique em View Site na barra de na-
vegação superior. Depois, use o bo-
tão Voltar do navegador para retor-
nar ao sistema de gerenciamento.
5. OS USUÁRIOS
O WordPress permite que várias pes-
soas publiquem notícias no blog e
comentem as mensagens. Cada usuá-
rio é classificado num nível de 0 a 10.
Quanto mais alto o nível, mais recur-
sos ficam acessíveis a ele. Quando al-
guém se cadastra, é classificado no
nível 0. Nesse nível, é permitido ape-
nas ler as mensagens. Mas o admi-
nistrador pode promover o usuário.
Para administrar os usuários, no
sistema de gerenciamento, clique em
Users. Observe as tabelas de autores
e usuários. Na coluna Level, aparece
o nível do usuário e os sinais + e -.
TUTORIAL/SERVIDOR DE BLOG
Clique nesses sinais para aumentar
ou diminuir o nível. Quando o nível
é maior ou igual a 1, a pessoa apare-
ce na lista de autores e pode publi-
car mensagens. Se o nível for 0, a ta-
bela mostra os sinais + e X. Clicando
em X, o usuário será excluído.
6. OS TOQUES FINAIS
Seu blog já pode ser usado. Mas há
várias outras coisas que você pode
fazer para personalizá-lo. Clique em
Links no menu de administração e
troque os links falsos do blog por
links para seções do seu site. Para
criar categorias em que podem ser
classificadas as mensagens, clique
em Categories. Se quiser permitir a
publicação de fotos no blog, clique
em Options e, em seguida, na aba
Miscellaneous. Nela, assinale a op-
ção Allow File Uploads e configure
as demais opções. Quando terminar
a configuração, não se esqueça de
clicar no botão Update Options pa-
ra executar as mudanças.
C O L E Ç Ã O I N F O > 59
TUTORIAL/SERVIDOR DE BLOG 1 23.05.05
TUTORIAL/SERVIDOR DE BLOG
Na maioria dos provedores de hos-
pedagem, o MySQL e o Apache estão
no mesmo servidor. Nesse caso, o en-
dereço é localhost (se tiver dúvidas,
pergunte ao provedor), que é o pa-
drão do WordPress. Fica assim:
define('DB_HOST', 'localhost');
No final, salve esse arquivo com o
nome wp-config.php.
3. A INSTALAÇÃO
Vamos instalar o WordPress. Faça o
upload da pasta wordpress para o ser-
vidor. Abra o navegador e, na barra
de endereço, digite a URL do seu si-
te seguida de /wordpress/install.php,
como neste exemplo:
http://www.empresa.com.br/
wordpress/install.php
O WordPress inicia um script de
instalação, verifica qual a versão do
PHP no servidor e mostra uma men-
sagem. Se estiver tudo certo, clique
no link Let's Go. Na tela seguinte
(Step 1), o script configura a base de
dados no MySQL. Clique em Step 2
para avançar. O instala-
dor vai criar as tabelas
do blog. No campo no pé
da página, digite o en-
dereço do seu site, como:
http://www.empresa.
com.br/.
Na etapa seguinte (Step
3), o instalador gera uma
senha aleatória para o
usuário admin, o adminis-
trador. Anote-a. Com is-
so, concluímos a instala-
ção e o blog já pode ser WordPress: formulário para escrever e definir ações
58 < C O L E Ç Ã O I N F O
17:12 Page 58
visitado. O endereço é do tipo
www.empresa.com.br/wordpress.
4. OS AJUSTES BÁSICOS
Passemos para a configuração bási-
ca do WordPress. Na tela final do script
de instalação ou na própria página do
blog, clique no link Login. Na caixa de
autenticação, forneça o nome admin
e a senha que você anotou. Você vai
entrar no sistema de gerenciamento.
Também é possível chegar a ele na-
vegando até www.empresa.com.
br/wordpress/wp-login.php.
No menu na parte superior da te-
la, clique em Options. A aba General
deverá estar ativa. No campo Weblog
Title, digite um nome para o blog. Na
linha logo abaixo, ponha uma breve
descrição dele, como “Novidades do
software X”. No campo E-mail Address,
escreva seu endereço de e-mail. No
item Membership, assinale se você
quer que qualquer pessoa possa se
cadastrar como usuário e se qualquer
usuário pode publicar artigos.
Na seção Date and Ti-
me, digite -3 no campo
Times in the Weblog
Should Differ By (se o ho-
rário de verão estiver em
vigor, use -2). Assim, es-
tamos dizendo ao Word-
Press para empregar o
horário oficial brasileiro.
No campo Default Date
Format, digite j/n/Y pa-
ra exibir as datas no for-
mato dia/mês/ano. Em Teste de blog: página simples e fácil de navegar
Default Time Format, es-
creva G:i. Assim, os horários serão
exibidos na forma horas:minutos,
com contagem de 24 horas. Quando
terminar, clique no botão Update Op-
tions. Se quiser ver como ficou o blog,
clique em View Site na barra de na-
vegação superior. Depois, use o bo-
tão Voltar do navegador para retor-
nar ao sistema de gerenciamento.
5. OS USUÁRIOS
O WordPress permite que várias pes-
soas publiquem notícias no blog e
comentem as mensagens. Cada usuá-
rio é classificado num nível de 0 a 10.
Quanto mais alto o nível, mais recur-
sos ficam acessíveis a ele. Quando al-
guém se cadastra, é classificado no
nível 0. Nesse nível, é permitido ape-
nas ler as mensagens. Mas o admi-
nistrador pode promover o usuário.
Para administrar os usuários, no
sistema de gerenciamento, clique em
Users. Observe as tabelas de autores
e usuários. Na coluna Level, aparece
o nível do usuário e os sinais + e -.
TUTORIAL/SERVIDOR DE BLOG
Clique nesses sinais para aumentar
ou diminuir o nível. Quando o nível
é maior ou igual a 1, a pessoa apare-
ce na lista de autores e pode publi-
car mensagens. Se o nível for 0, a ta-
bela mostra os sinais + e X. Clicando
em X, o usuário será excluído.
6. OS TOQUES FINAIS
Seu blog já pode ser usado. Mas há
várias outras coisas que você pode
fazer para personalizá-lo. Clique em
Links no menu de administração e
troque os links falsos do blog por
links para seções do seu site. Para
criar categorias em que podem ser
classificadas as mensagens, clique
em Categories. Se quiser permitir a
publicação de fotos no blog, clique
em Options e, em seguida, na aba
Miscellaneous. Nela, assinale a op-
ção Allow File Uploads e configure
as demais opções. Quando terminar
a configuração, não se esqueça de
clicar no botão Update Options pa-
ra executar as mudanças.
C O L E Ç Ã O I N F O > 59
TUTORIAL/ STREAMING 1 24.05.05 12:42 Page 60

TUTORIAL/STREAMING TUTORIAL/STREAMING

SOM E VÍDEO
siga pelo assisten-
te. No campo De-
fault Local Folder,

JORRAM DA TELA
indique a pasta html
do Xoops e clique
nas opções Next até
COMO PRODUZIR UM SITE EM PHP E MYSQL PARA concluir o processo.
OFERECER STREAMING DE MÚSICAS E FILMES Em seguida, o Cu-
POR AIRTON LOPES, COM OSMAR LAZARINI teFTP Pro se conec-
ta automaticamen-
ue tal montar um por- uma versão em português. O down- te ao seu site.

Q tal incrementado, com

direito a conteúdo de
áudio e vídeo para os
visitantes? Uma ferramenta que
load pode ser feito em www.info.
abril.com.br/download/3917.
shtml. Baixe também os módulos
Mediashow (www.info.abril.com.
Configuração: definindo preferências gerais do Xoops
3. FTP
Dentro do CuteFTP
Pro, o campo à es-
possibilita produzir sites multimí- br/download/3918.shtml) e iRadio shareware que funciona normalmen- querda mostra os arquivos locais.
dia com enorme variedade de mó- ( w w w. i n f o . a b r i l . c o m . b r/ te durante 30 dias sem pedir regis- Do lado direito, na janela maior,
dulos é o Xoops (veja teste na pá- download/3919.shtml). O envio dos tro. Naturalmente, o serviço de hos- exibe o conteúdo que está no di-
gina 29), um sistema de gerencia- arquivos para o hospedeiro do site pedagem que receberá o site tem retório remoto do FTP. Para en-
mento de portal de código aberto será feito com o cliente de FTP Cu- de oferecer suporte a PHP e MySQL. viar os arquivos, basta arrastá-los
baseado em PHP e MySQL e total- teFTP Pro 7.0 (www.info.abril. No nosso caso, usamos um host que para a janela do FTP. Você deve
mente gratuito. Entre os mais de com.br/download/2432.shtml), um roda em Red Hat Linux. transferir para o host todos os di-
100 módulos desen- retórios e arquivos que estiverem
volvidos pelos xoo- 2. EXTRAÇÃO DE ARQUIVOS dentro da pasta html.
pistas de carteirinha, Depois de fazer os downloads, ex- O mais seguro é enviar os ar-
há módulos para o traia o conteúdo do Xoops, for- quivos em lotes, para evitar pro-
streaming de arqui- mado por três pastas (docs, html blemas com hosts que limitam o
vos de som e vídeo e e extras), para o disco rígido. Em número de conexões simultâneas.
para adicionar rádios seguida, retire o conteúdo do Me- Depois que todos os arquivos fo-
online ao site. Siga os diashow para o interior do dire- rem enviados, aponte o browser
passos a seguir para tório Modules, que está dentro da para a URL do site. Automatica-
pôr suas músicas e pasta html do Xoops. Faça o mes- mente, você será redirecionado
vídeos na web em mo com os arquivo do iRadio. Ins- para a tela de instalação do Xoops.
grande estilo com o tale o CuteFTP Pro. Assim que o Escolha o idioma português.
auxílio do Xoops. programa é aberto pela primeira
vez, surge um assistente para con- 4. BANCO DE DADOS
1. DOWNLOADS figurar os dados da conta de FTP Hora de começar a montagem do
Graças à comunidade fornecidos pelo serviço de hospe- site. Vamos criar o banco de da-
verde-e-amarela, o dagem. Preencha o endereço do dos. Nesse momento aparece uma
Xoops 2.0.10 possui Site multimídia: todo feito com módulos do Xoops FTP, nome de usuário e senha e vantagem na escolha de hosts Li-

60 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 61
TUTORIAL/ STREAMING 1 24.05.05 12:42 Page 60

TUTORIAL/STREAMING TUTORIAL/STREAMING

SOM E VÍDEO
siga pelo assisten-
te. No campo De-
fault Local Folder,

JORRAM DA TELA
indique a pasta html
do Xoops e clique
nas opções Next até
COMO PRODUZIR UM SITE EM PHP E MYSQL PARA concluir o processo.
OFERECER STREAMING DE MÚSICAS E FILMES Em seguida, o Cu-
POR AIRTON LOPES, COM OSMAR LAZARINI teFTP Pro se conec-
ta automaticamen-
ue tal montar um por- uma versão em português. O down- te ao seu site.

Q tal incrementado, com

direito a conteúdo de
áudio e vídeo para os
visitantes? Uma ferramenta que
load pode ser feito em www.info.
abril.com.br/download/3917.
shtml. Baixe também os módulos
Mediashow (www.info.abril.com.
Configuração: definindo preferências gerais do Xoops
3. FTP
Dentro do CuteFTP
Pro, o campo à es-
possibilita produzir sites multimí- br/download/3918.shtml) e iRadio shareware que funciona normalmen- querda mostra os arquivos locais.
dia com enorme variedade de mó- ( w w w. i n f o . a b r i l . c o m . b r/ te durante 30 dias sem pedir regis- Do lado direito, na janela maior,
dulos é o Xoops (veja teste na pá- download/3919.shtml). O envio dos tro. Naturalmente, o serviço de hos- exibe o conteúdo que está no di-
gina 29), um sistema de gerencia- arquivos para o hospedeiro do site pedagem que receberá o site tem retório remoto do FTP. Para en-
mento de portal de código aberto será feito com o cliente de FTP Cu- de oferecer suporte a PHP e MySQL. viar os arquivos, basta arrastá-los
baseado em PHP e MySQL e total- teFTP Pro 7.0 (www.info.abril. No nosso caso, usamos um host que para a janela do FTP. Você deve
mente gratuito. Entre os mais de com.br/download/2432.shtml), um roda em Red Hat Linux. transferir para o host todos os di-
100 módulos desen- retórios e arquivos que estiverem
volvidos pelos xoo- 2. EXTRAÇÃO DE ARQUIVOS dentro da pasta html.
pistas de carteirinha, Depois de fazer os downloads, ex- O mais seguro é enviar os ar-
há módulos para o traia o conteúdo do Xoops, for- quivos em lotes, para evitar pro-
streaming de arqui- mado por três pastas (docs, html blemas com hosts que limitam o
vos de som e vídeo e e extras), para o disco rígido. Em número de conexões simultâneas.
para adicionar rádios seguida, retire o conteúdo do Me- Depois que todos os arquivos fo-
online ao site. Siga os diashow para o interior do dire- rem enviados, aponte o browser
passos a seguir para tório Modules, que está dentro da para a URL do site. Automatica-
pôr suas músicas e pasta html do Xoops. Faça o mes- mente, você será redirecionado
vídeos na web em mo com os arquivo do iRadio. Ins- para a tela de instalação do Xoops.
grande estilo com o tale o CuteFTP Pro. Assim que o Escolha o idioma português.
auxílio do Xoops. programa é aberto pela primeira
vez, surge um assistente para con- 4. BANCO DE DADOS
1. DOWNLOADS figurar os dados da conta de FTP Hora de começar a montagem do
Graças à comunidade fornecidos pelo serviço de hospe- site. Vamos criar o banco de da-
verde-e-amarela, o dagem. Preencha o endereço do dos. Nesse momento aparece uma
Xoops 2.0.10 possui Site multimídia: todo feito com módulos do Xoops FTP, nome de usuário e senha e vantagem na escolha de hosts Li-

60 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 61
TUTORIAL/ STREAMING 1 23.05.05
TUTORIAL/STREAMING
nux, pois geralmente eles ofere-
cem a ferramenta cPanelX, que fa-
cilita tremendamente a criação do
banco de dados. Acessar o cPanelX
é fácil, basta entrar no endereço
da ferramenta fornecido pelo hos-
pedeiro. No cPanelX, clique em
MySQL Databases. Na tela seguin-
te, no campo DB, digite o nome do
seu banco de dados e aperte o bo-
tão Add Db. Em seguida, apenas
confirme o nome do banco criado
e clique em Go Back. O cPanelX ge-
ra um banco de dados. Atenção pa-
ra a grafia do nome (nome do usuá-
rio_nome do banco de dados) de-
terminada pela ferramenta. O pró-
ximo passo é criar um usuário pa-
ra acessar o banco. Para isso, em
Users, indique um nome de usuá-
rio e senha para ele. O esquema
de nomenclatura será o mesmo:
nome do usuário titular_nome do
usuário do banco. Na mesma te-
la, você vai relacionar o novo usuá-
rio ao banco de dados. No campo
User, selecione o
nome de usuário do
banco de dados, e,
em Db, indique o
nome do banco.
Conclua pressionan-
do Add User to Db.
Para evitar confusão
com a variedade de
nomes de usuário (o
do titular do site e o
do banco de dados)
e senhas, anote tu-
do em local seguro. Módulos: o Mediashow e o iRadio estão na lista
62 < C O L E Ç Ã O I N F O
17:17 Page 62
5.
PERMISSÕES
De volta ao Xoops, uma tela em
português mostra quais diretórios
(uploads, cache, templates_c) e ar-
quivo (mainfile.php) deverão rece-
ber permissões especiais. A alte-
ração é feita por meio do CuteFTP
Pro. Clique com o botão direito so-
bre cada diretório e arquivo cita-
do e escolha a opção Properties/
CHMOD. Para dar permissão geral
de escrita para eles, nos campos
Group e Write, marque a caixa de
checagem Write e confirme. Em se-
guida, volte ao Xoops e atualize a
página de permissões. Se todas as
permissões exibirem sinal verde,
pressione o botão Prosseguir. Ca-
so alguma permissão não tenha si-
do aplicada corretamente, o pró-
prio Xoops faz o alerta e impede a
continuação da instalação.
6.
CONFIGURAÇÃO
Chegamos à janela de configura-
ção geral. Indique o nome do usuá-
Grupos: define quais grupos terão acesso aos módulos
rio do banco de dados, senha e no-
me do banco nos respectivos cam-
pos. Os demais campos não preci-
sam ser editados. Clique em Pros-
seguir e, na tela seguinte, confira
os dados. Se tudo estiver em or-
dem, pressione Prosseguir nas te-
las seguintes até a etapa de cria-
ção de usuário para o administra-
dor do site, na qual devem ser for-
necidos nome, e-mail e senha.
Feito isso, siga clicando em Pros-
seguir. Na última tela, você encon-
tra um link para ir à página inicial
do site recém-criado. Faça o login
como administrador para começar
a configurá-lo no Painel de Con-
trole do Xoops.
7. MÓDULOS
A primeira providência nessa eta-
pa é alterar novamente as proprie-
dades do mainfile.php, permitin-
do apenas a sua leitura (Read), de-
sabilitando as caixas Write e Exe-
TUTORIAL/STREAMING
cute. Em seguida,
remova o diretório
Install. Tudo isso é
feito pelo CuteFTP
Pro. O Xoops vem
com alguns recursos
básicos pré-instala-
dos, como fórum,
notícias, downloads
e links. A variedade
de módulos que
podem ser instala-
dos posteriormen-
te é enorme, como
agenda, álbum de
fotos etc. O visual também é con-
figurável com temas e skins (pe-
les). Neste tutorial, vamos indicar
apenas como configurar os módu-
los Mediashow e iRadio. Ao entrar
no painel de controle, no lado es-
querdo, está o acesso ao System
Admin. Posicionando o cursor so-
bre o ícone do System Admin, apa-
rece um menu. Clique em Módu-
los. Agora, dentro da lista de mó-
dulos, escolha aqueles que entra-
rão na página clicando no ícone
com o disquete de cada um dos
escolhidos. Confirme e, no roda-
pé da página seguinte, clique pa-
ra retornar à administração de mó-
dulos. Faça isso com o iRadio e o
Mediashow.
8. ACESSO
Em seguida, você deve determi-
nar quem terá acesso ao conteú-
do de áudio e vídeo do site. No
menu System Admin, clique em
C O L E Ç Ã O I N F O > 63
TUTORIAL/ STREAMING 1 23.05.05
TUTORIAL/STREAMING
nux, pois geralmente eles ofere-
cem a ferramenta cPanelX, que fa-
cilita tremendamente a criação do
banco de dados. Acessar o cPanelX
é fácil, basta entrar no endereço
da ferramenta fornecido pelo hos-
pedeiro. No cPanelX, clique em
MySQL Databases. Na tela seguin-
te, no campo DB, digite o nome do
seu banco de dados e aperte o bo-
tão Add Db. Em seguida, apenas
confirme o nome do banco criado
e clique em Go Back. O cPanelX ge-
ra um banco de dados. Atenção pa-
ra a grafia do nome (nome do usuá-
rio_nome do banco de dados) de-
terminada pela ferramenta. O pró-
ximo passo é criar um usuário pa-
ra acessar o banco. Para isso, em
Users, indique um nome de usuá-
rio e senha para ele. O esquema
de nomenclatura será o mesmo:
nome do usuário titular_nome do
usuário do banco. Na mesma te-
la, você vai relacionar o novo usuá-
rio ao banco de dados. No campo
User, selecione o
nome de usuário do
banco de dados, e,
em Db, indique o
nome do banco.
Conclua pressionan-
do Add User to Db.
Para evitar confusão
com a variedade de
nomes de usuário (o
do titular do site e o
do banco de dados)
e senhas, anote tu-
do em local seguro. Módulos: o Mediashow e o iRadio estão na lista
62 < C O L E Ç Ã O I N F O
17:17 Page 62
5.
PERMISSÕES
De volta ao Xoops, uma tela em
português mostra quais diretórios
(uploads, cache, templates_c) e ar-
quivo (mainfile.php) deverão rece-
ber permissões especiais. A alte-
ração é feita por meio do CuteFTP
Pro. Clique com o botão direito so-
bre cada diretório e arquivo cita-
do e escolha a opção Properties/
CHMOD. Para dar permissão geral
de escrita para eles, nos campos
Group e Write, marque a caixa de
checagem Write e confirme. Em se-
guida, volte ao Xoops e atualize a
página de permissões. Se todas as
permissões exibirem sinal verde,
pressione o botão Prosseguir. Ca-
so alguma permissão não tenha si-
do aplicada corretamente, o pró-
prio Xoops faz o alerta e impede a
continuação da instalação.
6.
CONFIGURAÇÃO
Chegamos à janela de configura-
ção geral. Indique o nome do usuá-
Grupos: define quais grupos terão acesso aos módulos
rio do banco de dados, senha e no-
me do banco nos respectivos cam-
pos. Os demais campos não preci-
sam ser editados. Clique em Pros-
seguir e, na tela seguinte, confira
os dados. Se tudo estiver em or-
dem, pressione Prosseguir nas te-
las seguintes até a etapa de cria-
ção de usuário para o administra-
dor do site, na qual devem ser for-
necidos nome, e-mail e senha.
Feito isso, siga clicando em Pros-
seguir. Na última tela, você encon-
tra um link para ir à página inicial
do site recém-criado. Faça o login
como administrador para começar
a configurá-lo no Painel de Con-
trole do Xoops.
7. MÓDULOS
A primeira providência nessa eta-
pa é alterar novamente as proprie-
dades do mainfile.php, permitin-
do apenas a sua leitura (Read), de-
sabilitando as caixas Write e Exe-
TUTORIAL/STREAMING
cute. Em seguida,
remova o diretório
Install. Tudo isso é
feito pelo CuteFTP
Pro. O Xoops vem
com alguns recursos
básicos pré-instala-
dos, como fórum,
notícias, downloads
e links. A variedade
de módulos que
podem ser instala-
dos posteriormen-
te é enorme, como
agenda, álbum de
fotos etc. O visual também é con-
figurável com temas e skins (pe-
les). Neste tutorial, vamos indicar
apenas como configurar os módu-
los Mediashow e iRadio. Ao entrar
no painel de controle, no lado es-
querdo, está o acesso ao System
Admin. Posicionando o cursor so-
bre o ícone do System Admin, apa-
rece um menu. Clique em Módu-
los. Agora, dentro da lista de mó-
dulos, escolha aqueles que entra-
rão na página clicando no ícone
com o disquete de cada um dos
escolhidos. Confirme e, no roda-
pé da página seguinte, clique pa-
ra retornar à administração de mó-
dulos. Faça isso com o iRadio e o
Mediashow.
8. ACESSO
Em seguida, você deve determi-
nar quem terá acesso ao conteú-
do de áudio e vídeo do site. No
menu System Admin, clique em
C O L E Ç Ã O I N F O > 63
TUTORIAL/ STREAMING 1 23.05.05
TUTORIAL/STREAMING
Grupos. Para deixar os arquivos
de som e vídeo totalmente aces-
síveis, na opção Anônimos, clique
em Modificar. No campo Permis-
sões de Acesso aos Blocos, sele-
cione as opções Internet Radio, My
Musics e My Films e clique em
Atualizar Grupo. Agora você irá
efetivamente modelar a página,
posicionando os blocos com cada
módulo. Pelo menu System Admin,
escolha Blocos. No campo Grupo,
escolha Anônimos. Você verá to-
dos os blocos. Nas colunas corres-
pondentes, escolha a posição de
cada bloco na página e indique
quais deverão ficar visíveis. Cli-
cando em Editar, você pode alte-
rar algumas características de ca-
da bloco, como o título.
Uma dica: a menos que você
queira que os arquivos comecem
a tocar automaticamente toda a
vez que a página for carregada, en-
tre no modo de edição de My Films
e My Musics e altere
o valor do campo
Autostart para zero.
Finalize clicando em
Enviar e, depois, em
Página Principal.
9. SOM E VÍDEO
A estrutura básica
do site já está pron-
ta para tocar som e
vídeo. Então é preci-
so fazer o upload
dos arquivos para o
host. Com o CuteFTP Administração: editando preferências do Mediashow
64 < C O L E Ç Ã O I N F O
17:17 Page 64
Pro, coloque os arquivos MP3 no
subdiretório Audio. O caminho
completo é (endereço-raiz do site/
modules/mediashow/media/audio).
Faça o mesmo com os videoclipes
nos formatos WMV e MPEG, en-
viado-os para o subdiretório Video
(endereço-raiz do site/modules/
mediashow/media/video). Para
configurar a rádio, no Painel de
Controle, deixe o cursor do mou-
se sobre o ícone iRadio, para vi-
sualizar o menu, e clique em Ad-
ministration. O Xoops traz 11 op-
ções de rádios online estrangeiras
preconfiguradas. Se você quiser
adicionar outras, clique em Add
New Station e indique o nome, o
site e a URL do streaming de áu-
dio da rádio. Sempre confirme as
mudanças clicando em Save. As-
sim que o banco de dados for atua-
lizado, todos os arquivos de som
e vídeo e links para rádios online
estarão disponíveis no site.
TUTORIAL/ LIVRO DE VISITAS 23.05.05 17:19 Page 65

TUTORIAL/LIVRO DE VISITAS

FALEM MAL,
MAS FALEM
DO MEU SITE
FAÇA UM LIVRO DE VISITAS E ACOMPANHE O QUE
OS INTERNAUTAS PENSAM DE SUA CASA NA WEB
POR ANDRÉ CARDOZO

livro de visitas é um lados. Em nosso caso, foi usado o

O dos recursos mais usa-

dos para saber a quan-
tas anda a popularida-
de de um site. Em essência, ele é
servidor web Internet Information
Services (IIS) 5.1, da Microsoft, com
PHP 4.3 e MySQL 4.1.

uma página que acumula todas as 1. O banco de dados

opiniões dos visitantes logo abai- Antes de passar para a criação do for-
xo do formulário de entrada de da- mulário, vamos criar um banco de
dos. Neste tutorial, mostraremos dados no MySQL. Isso pode ser feito
como criar um livro de visitas usan- por meio de comandos ou de inter-
do o Dreamweaver MX 2004, da faces gráficas. No nosso exemplo,
Macromedia. Para testar a página, usamos a interface gráfica SQLyog
é necessário que ela esteja em um (www.info.abril.com.br/download/
servidor com PHP e MySQL insta- 3232.shtml) e criamos um banco cha-
mado “visita”.
Dentro do banco
de dados montamos
uma tabela com cin-
co campos: “id”, “no-
me”, “email”, “co-
mentario” e “data”.
O primeiro campo
serve como chave
primária do banco.
Ele recebe números
inteiros e aumenta
seu valor em um a
Livro: as mensagens ficam abaixo da área de formulário cada novo comentá-

C O L E Ç Ã O I N F O > 65
TUTORIAL/ LIVRO DE VISITAS 23.05.05
TUTORIAL/LIVRO DE VISITAS
rio inserido no livro de visitas. Os
campos “nome”, “email” e “comen-
tario” são do tipo varchar e rece-
bem os dados digitados pelo inter-
nauta. Limitamos o número de ca-
racteres desses campos a 50, 30 e
500 unidades, respectivamente. O
campo “data” insere o dia em que
o comentário é feito.
2. O Dreamweaver
Com o banco de dados montado, ini-
cie o Dreamweaver. Antes de elabo-
rar a página do livro de visitas, pre-
cisamos montar um site para ela.
Para isso, acione o gerenciador, por
meio do menu Site > Manage Sites,
e clique no botão New.
Surge uma janela de configura-
ção. Escolha a categoria Local In-
fo e insira o nome do site, seu di-
retório local e sua pasta de ima-
gens. Na categoria Remote Info,
defina o diretório remoto e o tipo
de acesso ao servidor. Neste tuto-
rial, o acesso é local. Se o seu ser-
SQLyog: interface para o banco de dados MySQL
66 < C O L E Ç Ã O I N F O
17:19 Page 66
vidor for remoto, será necessário
informar os dados para a configu-
ração da conexão via FTP.
Para terminar a configuração do
site, acesse a categoria Testing Ser-
ver. Nela, defina o modelo de ser-
vidor (neste tutorial, PHP MySQL).
Novamente informe o tipo de aces-
so e o diretório remoto. Clique em
OK para encerrar a configuração.
3. O livro
Agora que temos o site configura-
do, vamos passar para a elabora-
ção do livro de visitas. Clique em
File > New e, na tela de criação do
arquivo, escolha a categoria Dyna-
mic e marque a opção PHP.
Estamos a esta altura com um do-
cumento em branco vinculado ao
site que criamos. Aqui você pode
usar as ferramentas do Dreamwea-
ver para elaborar o layout deseja-
do. Em nosso caso, criamos uma ta-
bela de uma linha, sete colunas e
700 pixels de largura. Na primeira
coluna, inserimos um
logotipo da INFO. Nas
outras seis colunas
digitamos os nomes
das seções.
Logo abaixo da ta-
bela anterior, cria-
mos uma outra ta-
bela, desta vez com
uma linha, uma co-
luna e 700 pixels de
largura. É nessa
tabela que vamos in-
serir o formulário.
TUTORIAL/ LIVRO DE VISITAS 23.05.05 17:19
4. O formulário
Com o layout monta-
do, passamos para a
criação do formulá-
rio. Ative a barra de
componentes de for-
mulário, clicando so-
bre a categoria Com-
mon e escolhendo a
opção Forms. Em Registro: o formulário insere a mensagem no banco
seguida, clique no
botão de inserção de formulário, o
primeiro ao lado da palavra Forms.
Surge um retângulo com bordas
pontilhadas. É dentro desse retân-
gulo que serão inseridos os compo-
nentes do formulário.
5. Os componentes
Para inserir os componentes, clique
dentro do retângulo vermelho e di-
gite a palavra “Nome”. Ao lado de-
la, insira uma caixa de texto, clican- do botão para “Enviar”.
do no botão Text Field da barra de
componentes de formulário.
Agora, selecione a caixa de texto
e, no painel de propriedades, mude
sua identificação para “nome” no
campo Text Field da janela de pro-
priedades. Em seguida, limite o va-
lor de caracteres a 50.
6. Os comentários
Ainda dentro da área de formulá-
rio, pule uma linha e digite a pala-
vra “E-mail”. Ao lado dela, insira
uma caixa de texto, clicando no
botão Text Field. Dê o nome de
identificação “email” à caixa e li-
mite o número de caracteres a 30.
Page 67
TUTORIAL/LIVRO DE VISITAS
A criação do campo de comen-
tários é fácil. Digite a palavra “Co-
mentários” e clique no botão Text
Area da barra de ferramentas pa-
ra inserir a área de texto. Na jane-
la de propriedades, mude a identi-
ficação da caixa para “comentário”.
Para completar o formulário, só
falta fazer o botão que envia os da-
dos. Clique no ícone Button da bar-
ra de ferramentas e mude o texto
O formulário está pronto. Logo
abaixo dele fica a área em que as
respostas aparecerão, uma abaixo
da outra. Para montá-la, digite as
palavras “Data”, “Nome”, “E-mail” e
“Comentários”, uma abaixo da ou-
tra. Isso completa a parte visual.
7. A conexão
Chegou a hora de inserir a progra-
mação do formulário. Abra o pai-
nel Databases e, nele, clique no si-
nal de mais e escolha a opção
MySQL Connection.
Surge a tela de configuração da
conexão. No primeiro campo, dê
um nome a ela. No segundo, insi-
C O L E Ç Ã O I N F O > 67
TUTORIAL/ LIVRO DE VISITAS 23.05.05
TUTORIAL/LIVRO DE VISITAS
Recordset: determinando a ordem das mensagens
ra o endereço do servidor (neste
tutorial, usamos o localhost). Digi-
te o nome de usuário “anonymous”
no terceiro campo e deixe a senha
em branco, já que o formulário se-
rá público. No campo Databases,
clique no botão Choose. O Dream-
weaver exibe todos os bancos de
dados do sistema. Escolha o ban-
co de nome “visita”, criado no pas-
so 1, e clique em OK. A conexão é
exibida no painel Databases.
8. As ações
A primeira ação do formulário é
inserir dados no banco, toda vez
que o internauta clicar no botão
Enviar. Para programar essa tare-
fa, abra o painel Server Behaviors,
clique no sinal de mais e escolha
a opção Insert Record.
Surge a tela de inserção de regis-
tro. No campo Connection, selecio-
ne a conexão criada no passo 7. No
último campo da janela devemos
indicar para qual página o internau-
68 < C O L E Ç Ã O I N F O
17:20 Page 68
ta será enviado após
clicar no botão. Co-
mo as respostas se-
rão inseridas na pró-
pria página do for-
mulário, basta digi-
tar o nome do arqui-
vo em que se está
trabalhando. Clique
em OK para encerrar
a configuração.
9. A exibição
Além de inserir os da-
dos no banco, nosso livro de visitas
exibe todas as mensagens enviadas
anteriormente. Para programar es-
sa ação, abra o painel Server Beha-
viors, clique no sinal de mais e es-
colha a opção Recordset.
Na tela de configuração, dê um
nome ao Recordset. No campo Con-
nection, escolha a conexão criada
no passo 6. Na opção Sort, escolha
a combinação “id” e “Descending”.
Isso significa que o recado mais re-
cente do livro (ou seja, com maior
“id”), aparecerá sempre acima do
anterior. Clique em OK.
10. As mensagens
Com as ações prontas, falta defi-
nir onde aparecerão as mensagens.
Neste tutorial, elas serão exibidas
logo abaixo do formulário, na área
criada no passo 5. Vamos agora
substituir as palavras digitadas na-
quele passo por variáveis. No do-
cumento, selecione a palavra “Da-
ta”. Abra o painel Bindings e na-
vegue pela árvore Recordset até
chegar ao campo “data”, criado no
passo 1. Marque o campo e clique
no botão Insert. Pronto, a palavra
“Data” foi substituída por uma va-
riável que incluirá a data em que
o comentário foi enviado.
11. O nome e o e-mail
O nosso próximo passo é inserir a
variável referente ao campo “no-
me”. Selecione a palavra “Nome”
e, no painel Bindings, navegue pe-
la árvore Recordset até chegar ao
campo “nome”. Marque o campo
e clique no botão Insert. Temos ou-
tro campo substituído.
O próximo campo a ser trocado
é o de e-mail. Selecione a palavra
“E-mail” e, novamente no painel
Bindings, navegue até o campo
“email”. Marque o campo e clique
Resultado: o livro de visitas é exibido no navegador já
com as mensagens na parte inferior da tela
TUTORIAL/LIVRO DE VISITAS
no botão Insert. A variável referen-
te a e-mail será inserida.
O último campo a ser substituído
é o de comentário. Selecione a pa-
lavra “Comentário” e, no painel Bin-
dings, navegue até o campo “comen-
tario”. Marque o campo e clique no
botão Insert. Agora todas as variá-
veis estão no formulário.
12. A lista de comentários
Para terminar o formulário, preci-
samos fazer com que a região que
exibe os comentários se repita a
cada novo registro. Assim, os co-
mentários serão acumulados na
página do livro de visitas.
Para executar essa tarefa, sele-
cione toda a área criada no passo
5 e configurada nos passos ante-
riores. Depois, abra o painel Ser-
ver Behaviors, clique no sinal de
mais e marque a op-
ção Repeat Region.
13. O teste
Na janela seguinte, se-
lecione a opção All
Records para que to-
dos os registros sejam
exibidos na mesma
página. Depois, clique
em OK. O formulário
está pronto. Lembre-
se de que, para testar
o funcionamento, é
necessário que a pá-
gina esteja em um
servidor com PHP e
MySQL instalados.
C O L E Ç Ã O I N F O > 69
TUTORIAL/ LIVRO DE VISITAS 23.05.05
TUTORIAL/LIVRO DE VISITAS
Recordset: determinando a ordem das mensagens
ra o endereço do servidor (neste
tutorial, usamos o localhost). Digi-
te o nome de usuário “anonymous”
no terceiro campo e deixe a senha
em branco, já que o formulário se-
rá público. No campo Databases,
clique no botão Choose. O Dream-
weaver exibe todos os bancos de
dados do sistema. Escolha o ban-
co de nome “visita”, criado no pas-
so 1, e clique em OK. A conexão é
exibida no painel Databases.
8. As ações
A primeira ação do formulário é
inserir dados no banco, toda vez
que o internauta clicar no botão
Enviar. Para programar essa tare-
fa, abra o painel Server Behaviors,
clique no sinal de mais e escolha
a opção Insert Record.
Surge a tela de inserção de regis-
tro. No campo Connection, selecio-
ne a conexão criada no passo 7. No
último campo da janela devemos
indicar para qual página o internau-
68 < C O L E Ç Ã O I N F O
17:20 Page 68
ta será enviado após
clicar no botão. Co-
mo as respostas se-
rão inseridas na pró-
pria página do for-
mulário, basta digi-
tar o nome do arqui-
vo em que se está
trabalhando. Clique
em OK para encerrar
a configuração.
9. A exibição
Além de inserir os da-
dos no banco, nosso livro de visitas
exibe todas as mensagens enviadas
anteriormente. Para programar es-
sa ação, abra o painel Server Beha-
viors, clique no sinal de mais e es-
colha a opção Recordset.
Na tela de configuração, dê um
nome ao Recordset. No campo Con-
nection, escolha a conexão criada
no passo 6. Na opção Sort, escolha
a combinação “id” e “Descending”.
Isso significa que o recado mais re-
cente do livro (ou seja, com maior
“id”), aparecerá sempre acima do
anterior. Clique em OK.
10. As mensagens
Com as ações prontas, falta defi-
nir onde aparecerão as mensagens.
Neste tutorial, elas serão exibidas
logo abaixo do formulário, na área
criada no passo 5. Vamos agora
substituir as palavras digitadas na-
quele passo por variáveis. No do-
cumento, selecione a palavra “Da-
ta”. Abra o painel Bindings e na-
vegue pela árvore Recordset até
chegar ao campo “data”, criado no
passo 1. Marque o campo e clique
no botão Insert. Pronto, a palavra
“Data” foi substituída por uma va-
riável que incluirá a data em que
o comentário foi enviado.
11. O nome e o e-mail
O nosso próximo passo é inserir a
variável referente ao campo “no-
me”. Selecione a palavra “Nome”
e, no painel Bindings, navegue pe-
la árvore Recordset até chegar ao
campo “nome”. Marque o campo
e clique no botão Insert. Temos ou-
tro campo substituído.
O próximo campo a ser trocado
é o de e-mail. Selecione a palavra
“E-mail” e, novamente no painel
Bindings, navegue até o campo
“email”. Marque o campo e clique
Resultado: o livro de visitas é exibido no navegador já
com as mensagens na parte inferior da tela
TUTORIAL/LIVRO DE VISITAS
no botão Insert. A variável referen-
te a e-mail será inserida.
O último campo a ser substituído
é o de comentário. Selecione a pa-
lavra “Comentário” e, no painel Bin-
dings, navegue até o campo “comen-
tario”. Marque o campo e clique no
botão Insert. Agora todas as variá-
veis estão no formulário.
12. A lista de comentários
Para terminar o formulário, preci-
samos fazer com que a região que
exibe os comentários se repita a
cada novo registro. Assim, os co-
mentários serão acumulados na
página do livro de visitas.
Para executar essa tarefa, sele-
cione toda a área criada no passo
5 e configurada nos passos ante-
riores. Depois, abra o painel Ser-
ver Behaviors, clique no sinal de
mais e marque a op-
ção Repeat Region.
13. O teste
Na janela seguinte, se-
lecione a opção All
Records para que to-
dos os registros sejam
exibidos na mesma
página. Depois, clique
em OK. O formulário
está pronto. Lembre-
se de que, para testar
o funcionamento, é
necessário que a pá-
gina esteja em um
servidor com PHP e
MySQL instalados.
C O L E Ç Ã O I N F O > 69
TUTORIAL/CATALOGO 23.05.05 17:21
TUTORIAL/CATÁLOGO
Catálogo: o Dreamweaver lê os registros e preenche a página com os produtos
MOSTRUÁRIO
VAPT-VUPT
CRIE UM CATÁLOGO DE PRODUTOS NO DREAMWEAVER
COM COMANDOS DE MENU
POR CARLOS MACHADO
uer montar um catálogo
Q de produtos para uma
loja online na maior mo-
leza? Experimente o
Dreamweaver, da Macromedia, um
software cheio de facilidades para o
desenvolvedor de sites. Neste tuto-
rial, vamos construir um mostruário
com recursos do Dreamweaver MX
2004 que permitem montar páginas
dinâmicas e exibir informações con-
70 < C O L E Ç Ã O I N F O
Page 70
1. INSTALE O IIS
A instalação do servidor web é o pri-
meiro passo. Vá ao Painel de Contro-
le e acione a opção Adicionar ou Re-
mover Programas. Na caixa de diá-
logo, clique em Adicionar/remover
componentes do Windows. Procure
o Internet Information Services (IIS)
na lista de componentes, marque a
caixa correspondente e clique em
Avançar. O Windows vai pedir que vo-
cê coloque no drive o CD de instala-
ção. Para testar se o servidor IIS foi
instalado corretamente, digite no
browser o seguinte endereço: loca-
lhost. Deve aparecer uma página web
avisando que o servidor está ativo.
Ao instalar o servidor web no mi-
cro, o Windows cria no drive C o sub-
diretório Inetpub\wwwroot, que é a
pasta-padrão do web site local. Vá a
essa pasta e crie nela um diretório
chamado catalogo. Nele vamos colo-
car todos os objetos do catálogo de
produtos da loja Great Fun. O passo-
tidas em bancos de dados, apenas
com comandos de menu. Em outras
palavras, não é preciso ter prática
nem habilidade com programação,
seja de banco de dados, seja de scripts
para automação das páginas. Além
do Dreamweaver, vamos usar o servi-
dor web IIS e o banco de dados Access.
O sistema operacional deve ser o Win-
dows 2000 ou XP, versão Professio-
nal (o XP Home não traz o IIS). IIS: a instalação do servidor web é o primeiro passo
TUTORIAL/CATÁLOGO
a-passo que vamos mostrar permite
que você desenvolva e teste a solu-
ção em sua máquina e depois faça o
upload das páginas para um site re-
moto na internet.
2. BANCO DE DADOS
Ativado o servidor, passemos ao ban-
co de dados. Construa no Access um
banco de dados com uma tabela sim-
ples (tb_produtos), contendo os itens
necessários à apresentação do produ-
to. Outros campos podem ser incluí-
dos, mas aqui trabalharemos apenas
com NomeProduto, Descrição, Preço
e Foto. Este último campo deve con-
ter o nome do arquivo JPG com a fo-
to do produto. Salve o banco de da-
dos com o nome produtos.mdb e co-
pie-o para o diretório da solução:
Inetpub\www root\catalogo. Alimen-
te o banco de dados com as informa-
ções sobre os produtos e copie tam-
bém para a pasta catalogo todos os
arquivos com as fotos dos produtos.
3. PÁGINA
BÁSICA
Vamos agora criar a
página-base para o
catálogo de produ-
tos. No Dreamwea-
ver, acione File/New.
Na tela New Docu-
ment, indique o tipo
de página que dese-
ja montar. Em Cate-
gory, escolha Dyna-
mic Page e, ao lado,
ASP VB Script. Clique
C O L E Ç Ã O I N F O > 71
TUTORIAL/CATALOGO 23.05.05 17:21
TUTORIAL/CATÁLOGO
Catálogo: o Dreamweaver lê os registros e preenche a página com os produtos
MOSTRUÁRIO
VAPT-VUPT
CRIE UM CATÁLOGO DE PRODUTOS NO DREAMWEAVER
COM COMANDOS DE MENU
POR CARLOS MACHADO
uer montar um catálogo
Q de produtos para uma
loja online na maior mo-
leza? Experimente o
Dreamweaver, da Macromedia, um
software cheio de facilidades para o
desenvolvedor de sites. Neste tuto-
rial, vamos construir um mostruário
com recursos do Dreamweaver MX
2004 que permitem montar páginas
dinâmicas e exibir informações con-
70 < C O L E Ç Ã O I N F O
Page 70
1. INSTALE O IIS
A instalação do servidor web é o pri-
meiro passo. Vá ao Painel de Contro-
le e acione a opção Adicionar ou Re-
mover Programas. Na caixa de diá-
logo, clique em Adicionar/remover
componentes do Windows. Procure
o Internet Information Services (IIS)
na lista de componentes, marque a
caixa correspondente e clique em
Avançar. O Windows vai pedir que vo-
cê coloque no drive o CD de instala-
ção. Para testar se o servidor IIS foi
instalado corretamente, digite no
browser o seguinte endereço: loca-
lhost. Deve aparecer uma página web
avisando que o servidor está ativo.
Ao instalar o servidor web no mi-
cro, o Windows cria no drive C o sub-
diretório Inetpub\wwwroot, que é a
pasta-padrão do web site local. Vá a
essa pasta e crie nela um diretório
chamado catalogo. Nele vamos colo-
car todos os objetos do catálogo de
produtos da loja Great Fun. O passo-
tidas em bancos de dados, apenas
com comandos de menu. Em outras
palavras, não é preciso ter prática
nem habilidade com programação,
seja de banco de dados, seja de scripts
para automação das páginas. Além
do Dreamweaver, vamos usar o servi-
dor web IIS e o banco de dados Access.
O sistema operacional deve ser o Win-
dows 2000 ou XP, versão Professio-
nal (o XP Home não traz o IIS). IIS: a instalação do servidor web é o primeiro passo
TUTORIAL/CATÁLOGO
a-passo que vamos mostrar permite
que você desenvolva e teste a solu-
ção em sua máquina e depois faça o
upload das páginas para um site re-
moto na internet.
2. BANCO DE DADOS
Ativado o servidor, passemos ao ban-
co de dados. Construa no Access um
banco de dados com uma tabela sim-
ples (tb_produtos), contendo os itens
necessários à apresentação do produ-
to. Outros campos podem ser incluí-
dos, mas aqui trabalharemos apenas
com NomeProduto, Descrição, Preço
e Foto. Este último campo deve con-
ter o nome do arquivo JPG com a fo-
to do produto. Salve o banco de da-
dos com o nome produtos.mdb e co-
pie-o para o diretório da solução:
Inetpub\www root\catalogo. Alimen-
te o banco de dados com as informa-
ções sobre os produtos e copie tam-
bém para a pasta catalogo todos os
arquivos com as fotos dos produtos.
3. PÁGINA
BÁSICA
Vamos agora criar a
página-base para o
catálogo de produ-
tos. No Dreamwea-
ver, acione File/New.
Na tela New Docu-
ment, indique o tipo
de página que dese-
ja montar. Em Cate-
gory, escolha Dyna-
mic Page e, ao lado,
ASP VB Script. Clique
C O L E Ç Ã O I N F O > 71
TUTORIAL/CATALOGO 23.05.05 17:22
TUTORIAL/CATÁLOGO
em Create. Você tem uma página ASP
em branco. Salve-a com o nome ca-
talogo.asp. Agora, use tabelas (In-
sert/Table) para compor a estrutura
do documento. Em cima, uma tabe-
la horizontal com o logotipo da em-
presa e links de interação com o
usuário do site: Ajuda, Cadastro, Bus-
ca etc. Outra linha horizontal pode
conter links para os tipos de produ-
tos. Nossa loja fictícia, a Great Fun
Importadora, vende produtos de in-
formática e tecnologia de consumo.
Abaixo, numa coluna à esquerda, há
outro menu, com links para subcate-
gorias de produtos. A barra superior
e a coluna à esquerda têm a mesma
cor de fundo, que deve se harmoni-
zar com a cor do logotipo. Nessas
áreas já definidas ficam os elemen-
tos fixos da página. No retângulo res-
tante, vamos montar os itens dinâmi-
cos, que são a razão deste tutorial.
4. CAMPOS DE DADOS
No quadrado livre da
página, insira uma ta-
bela com duas colu-
nas: uma para a foto
do produto e a outra
para nome, descrição
e preço. Agora, vamos
dizer ao Dreamwea-
ver onde estão os da-
dos que vão alimen-
tar a página. Na colu-
na à direita da tela do
programa, na subja-
nela Application, cli- Automação: os campos de dados (à direita da tela) são
que na orelha Databa- arrastados simplesmente para a página
72 < C O L E Ç Ã O I N F O
Page 72
Access: tabela de apresentação dos produtos
ses. Em seguida, clique no botãozi-
nho com um sinal + e escolha a op-
ção Data Source Name (nome da
fonte de dados). Na janela que se
abre, digite um nome na caixa Con-
nection Name — por exemplo, ca-
meras (é melhor sem acento, para
evitar eventuais problemas). Em se-
guida, clique no botão Define e, na
tela seguinte, escolha a alternativa
Banco de Dados do Access. Acione
o botão Configurar e, depois, Sele-
cionar. Indique o endereço do ban-
co de dados produtos.mdb e dê OK.
Agora, marque o botão Using Local
DSN e acione OK. Na janela da ore-
lha Databases, aparece a conexão
cameras. Abra-a, e veja que a caixa
Tables exibe a tabela tb_produtos.
Dentro dela estão todos os campos
da tabela. Com isso, definimos uma
conexão com o banco de dados.
Agora, precisamos usar essa co-
nexão. Clique na orelha Bindings e
acione o botão + e escolha Recordset
(Query). Na tela Recordset, escolha
cameras na caixa Connection e dê OK.
Os nomes dos campos da tabela pro-
dutos aparecem listados. Arraste os
campos NomeProduto, Descrição, Pre-
ço e Foto para os lugares onde de-
vem aparecer na tabela livre. Salve o
arquivo e acione F12 para ver como
vai ficar no browser. Confira: em lu-
gar da foto de um produto, aparece
o nome do arquivo correspondente.
Para resolver isso, volte ao design da
página, apague o campo da foto e dê
Imagem: o comando Insert/Image põe a foto no lugar
TUTORIAL/CATÁLOGO
o comando Insert/Image. Na janela
Select Image Source, clique na op-
ção Data Sources, marque o campo
Sources e dê OK. Salve o arquivo e
reveja-o no browser. Agora, está per-
feito. Na verdade, não deveríamos
ter arrastado o campo Foto para a
página. Como se trata de imagem, o
procedimento correto é feito por
meio do comando Insert/Image.
5. DADOS DINÂMICOS
Até agora, só apareceu um produ-
to na página, que é o primeiro re-
gistro da tabela. Para mostrar mais
produtos, é preciso varrer a base de
dados. Para isso, o Dreamweaver
oferece um belo truque. Ele permi-
te que você defina áreas da página
que devem ser repetidas, cada uma
mostrando um registro de dados.
Como fazer isso? Selecione a tabe-
la que contém os campos de dados.
Em seguida, na subjanela Applica-
tion, orelha Server Behaviors (com-
portamentos do servidor), clique no
botão + e escolha Re-
peat Region. Na cai-
xa de diálogo com es-
se mesmo nome, in-
dique o número de
produtos que devem
aparecer numa pági-
na. O número vai de-
pender do tamanho
da foto e da descrição
a serem exibidos. Dê
OK, salve o arquivo e
veja-o no browser
(F12). Perfeito.
C O L E Ç Ã O I N F O > 73
TUTORIAL/CATALOGO 23.05.05 17:22
TUTORIAL/CATÁLOGO
em Create. Você tem uma página ASP
em branco. Salve-a com o nome ca-
talogo.asp. Agora, use tabelas (In-
sert/Table) para compor a estrutura
do documento. Em cima, uma tabe-
la horizontal com o logotipo da em-
presa e links de interação com o
usuário do site: Ajuda, Cadastro, Bus-
ca etc. Outra linha horizontal pode
conter links para os tipos de produ-
tos. Nossa loja fictícia, a Great Fun
Importadora, vende produtos de in-
formática e tecnologia de consumo.
Abaixo, numa coluna à esquerda, há
outro menu, com links para subcate-
gorias de produtos. A barra superior
e a coluna à esquerda têm a mesma
cor de fundo, que deve se harmoni-
zar com a cor do logotipo. Nessas
áreas já definidas ficam os elemen-
tos fixos da página. No retângulo res-
tante, vamos montar os itens dinâmi-
cos, que são a razão deste tutorial.
4. CAMPOS DE DADOS
No quadrado livre da
página, insira uma ta-
bela com duas colu-
nas: uma para a foto
do produto e a outra
para nome, descrição
e preço. Agora, vamos
dizer ao Dreamwea-
ver onde estão os da-
dos que vão alimen-
tar a página. Na colu-
na à direita da tela do
programa, na subja-
nela Application, cli- Automação: os campos de dados (à direita da tela) são
que na orelha Databa- arrastados simplesmente para a página
72 < C O L E Ç Ã O I N F O
Page 72
Access: tabela de apresentação dos produtos
ses. Em seguida, clique no botãozi-
nho com um sinal + e escolha a op-
ção Data Source Name (nome da
fonte de dados). Na janela que se
abre, digite um nome na caixa Con-
nection Name — por exemplo, ca-
meras (é melhor sem acento, para
evitar eventuais problemas). Em se-
guida, clique no botão Define e, na
tela seguinte, escolha a alternativa
Banco de Dados do Access. Acione
o botão Configurar e, depois, Sele-
cionar. Indique o endereço do ban-
co de dados produtos.mdb e dê OK.
Agora, marque o botão Using Local
DSN e acione OK. Na janela da ore-
lha Databases, aparece a conexão
cameras. Abra-a, e veja que a caixa
Tables exibe a tabela tb_produtos.
Dentro dela estão todos os campos
da tabela. Com isso, definimos uma
conexão com o banco de dados.
Agora, precisamos usar essa co-
nexão. Clique na orelha Bindings e
acione o botão + e escolha Recordset
(Query). Na tela Recordset, escolha
cameras na caixa Connection e dê OK.
Os nomes dos campos da tabela pro-
dutos aparecem listados. Arraste os
campos NomeProduto, Descrição, Pre-
ço e Foto para os lugares onde de-
vem aparecer na tabela livre. Salve o
arquivo e acione F12 para ver como
vai ficar no browser. Confira: em lu-
gar da foto de um produto, aparece
o nome do arquivo correspondente.
Para resolver isso, volte ao design da
página, apague o campo da foto e dê
Imagem: o comando Insert/Image põe a foto no lugar
TUTORIAL/CATÁLOGO
o comando Insert/Image. Na janela
Select Image Source, clique na op-
ção Data Sources, marque o campo
Sources e dê OK. Salve o arquivo e
reveja-o no browser. Agora, está per-
feito. Na verdade, não deveríamos
ter arrastado o campo Foto para a
página. Como se trata de imagem, o
procedimento correto é feito por
meio do comando Insert/Image.
5. DADOS DINÂMICOS
Até agora, só apareceu um produ-
to na página, que é o primeiro re-
gistro da tabela. Para mostrar mais
produtos, é preciso varrer a base de
dados. Para isso, o Dreamweaver
oferece um belo truque. Ele permi-
te que você defina áreas da página
que devem ser repetidas, cada uma
mostrando um registro de dados.
Como fazer isso? Selecione a tabe-
la que contém os campos de dados.
Em seguida, na subjanela Applica-
tion, orelha Server Behaviors (com-
portamentos do servidor), clique no
botão + e escolha Re-
peat Region. Na cai-
xa de diálogo com es-
se mesmo nome, in-
dique o número de
produtos que devem
aparecer numa pági-
na. O número vai de-
pender do tamanho
da foto e da descrição
a serem exibidos. Dê
OK, salve o arquivo e
veja-o no browser
(F12). Perfeito.
C O L E Ç Ã O I N F O > 73
TUTORIAL/CATALOGO 23.05.05 17:23
TUTORIAL/CATÁLOGO
6. PAGINAÇÃO
Você pode definir, por exemplo,
que cada página exiba apenas dez
produtos. Muito bem. Mas como
mostrar a próxima página? Não se
preocupe: o Dreamweaver tam-
bém oferece o recurso de pagina-
ção. Abaixo da tabela onde apa-
recem os dados, inclua outra, sem
bordas, e com seis colunas. Ajus-
te a largura das colunas para que
quatro delas, menores, fiquem no
centro. Nelas vamos colocar links,
respectivamente, para a primeira
página, a página anterior, a pró-
xima e a última. Selecione o item
que vai receber o link de primei-
ra página (pode ser texto ou ima-
gem) e volte à orelha Server Be-
haviors. Clique no botão + e esco-
lha Recordset Paging/Move to First
Record. Para o botão página an-
terior, repita o procedimento e es-
colha Move to Previous Record.
Paginação: exibição de número de produtos pré-definida
74 < C O L E Ç Ã O I N F O
Page 74
Para os links seguintes, aplique
Move to Next Record e Move to
Last Record. Falta o último deta-
lhe. Se, na primeira página, você
clicar no link para ela mesma ou
a anterior, produzirá um erro. Pa-
ra evitá-lo, selecione o link e apli-
que nova regra. Clique no botão +
e selecione Show Region/Show
Region If Not First Record. Ou se-
ja, o link só aparecerá se a pági-
na não for a primeira.
Repita o procedimento para o
link de página anterior. Nos outros
dois, próximo e último, escolha
Show Region If Not Last Record.
Tarefa concluída. Você ainda po-
de sofisticar o seu catálogo. Crie
no banco de dados uma tabela pa-
ra cada categoria de produtos: câ-
meras, monitores, celulares, ar-
mazenamento etc. Na montagem
do catálogo, destine uma página
para cada categoria. Cada uma
dessas páginas de
categorias estará
vinculada a uma ta-
bela de dados. Há
outra opção: reúna
tudo no mesmo
banco de dados e
associe cada pági-
na a um grupo de
dados filtrado pela
categoria. Para apre-
ciar o catálogo di-
retamente no seu
navegador, digite:
localhost/catalogo/
catalogo.asp.
TUTORIAL/HELP DESK 23.05.05 17:24 Page 75

TUTORIAL/HELP DESK

O PHP CONVERSA
COM OS
CLIENTES ONLINE
MONTE UM SISTEMA DE BATE-PAPO PARA ATENDER
AOS VISITANTES DO SITE
POR CARLOS MACHADO

osso ajudá-lo? A inicia- fora do horário de atendimento), o

P tiva de um atendente
online impressiona bem
o visitante de qualquer
site, especialmente os que vendem
visitante pode enviar uma mensa-
gem de e-mail à empresa. Veja a se-
guir os passos para obter e instalar
o Crafty Syntax Live Help.
produtos ou serviços e querem se
diferenciar. Por isso mesmo, no tu- 1. OS INGREDIENTES
torial a seguir, vamos mostrar como Confira a lista do que você precisa
adicionar a um site um sistema de para a instalação. Primeiro, você de-
bate-papo ao vivo. A ferramenta bá- ve ter acesso a um servidor web Li-
sica é o Crafty Syntax Live Help, um nux no qual estejam ativos o inter-
produto de código aberto que é pretador de scripts PHP e o banco de
construído em PHP e usa o banco dados MySQL. Não é necessário co-
de dados MySQL para ar-
mazenar as informações.
O Crafty Syntax deve ser
instalado num servidor
web. O serviço é chama-
do por meio de um link
que pode ser colocado
em qualquer página do
site. Esse link abre uma
sessão de bate-papo en-
tre o internauta e um
atendente. Se o sistema
de chat ao vivo não esti-
ver ativo (por exemplo, Configuração: coloque as mensagens em português

C O L E Ç Ã O I N F O > 75
TUTORIAL/HELP DESK 23.05.05 17:25
TUTORIAL/HELP DESK
nhecer nada de PHP, mas
é preciso pelo menos sa-
ber criar um banco de da-
dos em SQL e lidar com
arquivos no Linux. Para
começar, faça o download
do Crafty Syntax Live Help
no endereço www.info.
abril.com.br/download/
4167.shtml.
Para deixar tudo pron-
to, prepare o MySQL. Crie
um banco de dados vazio.
Uma vez logado no MySQL,
o comando é simples:
create database livehelp;
livehelp, no caso, é o no-
me do banco de dados,
Crafty Syntax: tela de instalação define acessos
mas você pode escolher
outro. Anote o nome do usuário e a
senha desse banco de dados.
2. A INSTALAÇÃO
Você pode ter baixado um arquivo
compactado no formato TAR.GZ ou
ZIP. Extraia os arquivos e faça o
upload de todos eles para o subdi-
retório /livehelp no diretório-raiz de
seu website. (Se quiser, renomeie o
diretório para algo como /ajudaon-
line, /ajuda ou algo que lhe pareça
melhor.) Altere as permissões do ar-
quivo config.php para 777 — ou se-
ja, licença para ler, escrever e exe-
cutar, concedida a todos: público,
grupo e usuário. Uma forma de fa-
zer isso é clicar com o botão direi-
to no arquivo config.php e, no me-
nu, escolher CHMOD ou Change At-
tributes. Abre-se uma caixa, na qual
76 < C O L E Ç Ã O I N F O
Page 76
você deve digitar o número 777 ou
então marcar todas as caixas Read,
Write, Execute. Agora, abra seu brow-
ser e execute o arquivo setup.php no
site, chamando a seguinte URL: www.
seudominio.com.br/livehelp/
setup.php
3. A CONFIGURAÇÃO
Agora, você entrou no configurador
automático do Crafty Syntax. Acom-
panhe o roteiro:
A. Na caixa de combinação Langua-
ge, escolha o idioma Portuguese
(Brazilian) e, como se trata da pri-
meira instalação, escolha New Ins-
tallation na caixa Installation. O no-
vo idioma só entrará em ação de-
pois que os ajustes forem comple-
tados. Tanto a administração do
TUTORIAL/HELP DESK
Crafty Syntax como as telas que apa- assim: var/www/html/livehelp.
recem para o usuário estarão em Se tiver dúvida sobre esse cami-
português. nho, consulte a empresa que hos-
B. Na caixa Title of your Live Help, peda seu site.
digite o título do seu serviço de ba- G. Digite uma mensagem de boas-
te-papo online. Pode ser, por exem- vindas. Ela aparecerá quando o
plo, “Loja X — Atendimento Online”. usuário abrir o Live Help. Pode ser
Em nossa montagem usamos “Aten- algo como “Bem-vindo ao nosso sis-
dimento Infolab”. tema de ajuda online. Para iniciar,
C. Na caixa Live Help — HTTP Path, digite seu nome na caixa abaixo”.
digite o endereço completo do sis- H. Na caixa Database, selecione o
tema de bate-papo: http://www. formato de banco de dados que vo-
seudominio.com.br/livehelp. cê vai usar. Escolha a opção MySQL.
Adapte esse endereço ao nome do O Craft Syntax também dá suporte
domínio e ao nome do diretório, ca- a banco de dados de texto. O
so você não tenha usado livehelp. MySQL, no entanto, é uma alterna-
Atenção: não inclua uma barra (/) no tiva mais segura.
final do endereço. A caixa LiveHelp I. Agora, indique as informações
— HTTPS não precisa ser preenchi- relativas ao banco de dados
da, a não ser se você decidir usar o MySQL. Na caixa SQL Server, indi-
protocolo seguro HTTPS. que localhost. Em SQL Database,
D. Na seção User/Password, digite digite o nome que você deu ao
o nome de usuário do administrador banco de dados (livehelp ou ou-
e uma senha, duas vezes. tro). Nas caixas SQL User e SQL
E. Na seção Administration E- Password, digite o nome de usuá-
mail, forneça o endere-
ço do administrador. Se
você esquecer a senha,
o Live Help a enviará pa-
ra esse endereço.
F. Agora, em Full Path to
Live — Help, forneça o ca-
minho completo do pro-
grama. Atenção: não se
trata de uma URL, mas
do diretório do progra-
ma na estrutura do ser-
vidor. É algo que varia
conforme a estrutura do
servidor. Mais ou menos Atendimento: bate-papo na tela do operador
C O L E Ç Ã O I N F O > 77
TUTORIAL/HELP DESK 23.05.05 17:25
TUTORIAL/HELP DESK
nhecer nada de PHP, mas
é preciso pelo menos sa-
ber criar um banco de da-
dos em SQL e lidar com
arquivos no Linux. Para
começar, faça o download
do Crafty Syntax Live Help
no endereço www.info.
abril.com.br/download/
4167.shtml.
Para deixar tudo pron-
to, prepare o MySQL. Crie
um banco de dados vazio.
Uma vez logado no MySQL,
o comando é simples:
create database livehelp;
livehelp, no caso, é o no-
me do banco de dados,
Crafty Syntax: tela de instalação define acessos
mas você pode escolher
outro. Anote o nome do usuário e a
senha desse banco de dados.
2. A INSTALAÇÃO
Você pode ter baixado um arquivo
compactado no formato TAR.GZ ou
ZIP. Extraia os arquivos e faça o
upload de todos eles para o subdi-
retório /livehelp no diretório-raiz de
seu website. (Se quiser, renomeie o
diretório para algo como /ajudaon-
line, /ajuda ou algo que lhe pareça
melhor.) Altere as permissões do ar-
quivo config.php para 777 — ou se-
ja, licença para ler, escrever e exe-
cutar, concedida a todos: público,
grupo e usuário. Uma forma de fa-
zer isso é clicar com o botão direi-
to no arquivo config.php e, no me-
nu, escolher CHMOD ou Change At-
tributes. Abre-se uma caixa, na qual
76 < C O L E Ç Ã O I N F O
Page 76
você deve digitar o número 777 ou
então marcar todas as caixas Read,
Write, Execute. Agora, abra seu brow-
ser e execute o arquivo setup.php no
site, chamando a seguinte URL: www.
seudominio.com.br/livehelp/
setup.php
3. A CONFIGURAÇÃO
Agora, você entrou no configurador
automático do Crafty Syntax. Acom-
panhe o roteiro:
A. Na caixa de combinação Langua-
ge, escolha o idioma Portuguese
(Brazilian) e, como se trata da pri-
meira instalação, escolha New Ins-
tallation na caixa Installation. O no-
vo idioma só entrará em ação de-
pois que os ajustes forem comple-
tados. Tanto a administração do
TUTORIAL/HELP DESK
Crafty Syntax como as telas que apa- assim: var/www/html/livehelp.
recem para o usuário estarão em Se tiver dúvida sobre esse cami-
português. nho, consulte a empresa que hos-
B. Na caixa Title of your Live Help, peda seu site.
digite o título do seu serviço de ba- G. Digite uma mensagem de boas-
te-papo online. Pode ser, por exem- vindas. Ela aparecerá quando o
plo, “Loja X — Atendimento Online”. usuário abrir o Live Help. Pode ser
Em nossa montagem usamos “Aten- algo como “Bem-vindo ao nosso sis-
dimento Infolab”. tema de ajuda online. Para iniciar,
C. Na caixa Live Help — HTTP Path, digite seu nome na caixa abaixo”.
digite o endereço completo do sis- H. Na caixa Database, selecione o
tema de bate-papo: http://www. formato de banco de dados que vo-
seudominio.com.br/livehelp. cê vai usar. Escolha a opção MySQL.
Adapte esse endereço ao nome do O Craft Syntax também dá suporte
domínio e ao nome do diretório, ca- a banco de dados de texto. O
so você não tenha usado livehelp. MySQL, no entanto, é uma alterna-
Atenção: não inclua uma barra (/) no tiva mais segura.
final do endereço. A caixa LiveHelp I. Agora, indique as informações
— HTTPS não precisa ser preenchi- relativas ao banco de dados
da, a não ser se você decidir usar o MySQL. Na caixa SQL Server, indi-
protocolo seguro HTTPS. que localhost. Em SQL Database,
D. Na seção User/Password, digite digite o nome que você deu ao
o nome de usuário do administrador banco de dados (livehelp ou ou-
e uma senha, duas vezes. tro). Nas caixas SQL User e SQL
E. Na seção Administration E- Password, digite o nome de usuá-
mail, forneça o endere-
ço do administrador. Se
você esquecer a senha,
o Live Help a enviará pa-
ra esse endereço.
F. Agora, em Full Path to
Live — Help, forneça o ca-
minho completo do pro-
grama. Atenção: não se
trata de uma URL, mas
do diretório do progra-
ma na estrutura do ser-
vidor. É algo que varia
conforme a estrutura do
servidor. Mais ou menos Atendimento: bate-papo na tela do operador
C O L E Ç Ã O I N F O > 77
TUTORIAL/HELP DESK 23.05.05 17:25
TUTORIAL/HELP DESK
rio e a senha do administrador, de-
finidos durante a criação do ban-
co de dados.
J. Clique no botão Install. O Crafty
Syntax está configurado. Mas, an-
tes de usar o Live Help pela primei-
ra vez, apague o arquivo setup.php.
Esse arquivo serve apenas para a
tarefa de configuração. Última ta-
refa: volte ao arquivo config.php e,
de forma idêntica ao que foi mos-
trado no passo 2, altere as permis-
sões do arquivo para 755 ou 400.
O primeiro número indica que to-
dos podem ler e
executar o arqui-
vo, mas só o do-
777
no pode escrever É o número da permissão para ler,
escrever e executar. Mude para 755
nele. O outro in- se quiser restringir a escrita ou 400
dica que somen- para impedir a leitura
te o dono pode
ler o arquivo. Lembre-se: para mo-
dificar as configurações, você pre-
cisará ajustar as permissões do ar-
quivo para 777 e depois revertê-
las para 755 ou 400.
4. A INSTALAÇÃO NA WEB
Instalado e configurado o Crafty
Syntax, você já pode entrar no sis-
tema. No browser, digite www.
seudominio.com.br/livehelp/.
Surge a tela de administração do
produto. Faça o login usando o no-
me de usuário e a senha definidos
na instalação. Agora, clique na ore-
lha Departamentos. A tela princi-
pal mostra um departamento ca-
dastrado, “default”. Clique no link
Gerar HTML. Na próxima tela, in-
78 < C O L E Ç Ã O I N F O
Page 78
dique o tipo de HTML que deseja
criar. Na caixa associada à pergun-
ta “Qual formato você quer?”, es-
colha Link Simples (Sem Opções
de Convite). Acione o botão Criar.
Com isso o programa exibe o có-
digo HTML que você deve copiar
e inserir nas páginas de entrada
para o serviço de atendimento on-
line. Trata-se, basicamente, de um
link que chama um script PHP: http://
www.seudominio.com.br/livehelp/
livehelp.php?department=1
Esse link pode ser colocado em
qualquer página
do site onde vo-
cê queira ofere-
cer ajuda ao vi-
sitante. Ao clicar
no link, ele entra
na tela de chat.
Do outro lado, um operador, lo-
gado na interface de administra-
ção, atende e inicia o bate-papo.
Observe que o Crafty Syntax traz
um departamento e um operador-
padrão. Você pode criar outros,
usando o menu da tela de admi-
nistração. Para finalizar, na ore-
lha Departamentos, clique no link
Configurações, ao lado do nome
do departamento. As mensagens
de interação com o usuário estão
em inglês. Personalize essas men-
sagens em português e, no final
da tela, clique no botão Atualizar.
Seu sistema de atendimento es-
tá pronto. Explore mais o Crafty
Syntax e veja que há vários outros
recursos de administração.
TUTORIAL/ VOTAÇÃO 23.05.05 17:27 Page 79
DÊ SEU VOTO
PARA O FLASH
MONTE UM SISTEMA DE VOTAÇÃO E AMPLIE A
INTERATIVIDADE DE SEU SITE
POR ANDRÉ CARDOZO
s enquetes são uma boa
A maneira de estimular a
interatividade com visi-
tantes de qualquer site,
independentemente do assunto abor-
dado. Neste tutorial, explicaremos co-
mo criar um sistema de votação usan-
do o Flash MX. Para que a votação
funcione, os arquivos devem estar em
um servidor com suporte a PHP.
Acompanhe os passos a seguir.
1. OS ARQUIVOS
Antes de mais nada, faça o download
do arquivo zipado que completa es-
te tutorial em www.info.abril.com.br/
download/4081.shtml. Ele contém
Botão: componente invisível tem conteúdo no estado Hit menta de desenho retan-
TUTORIAL/VOTAÇÃO
os arquivos actionscript.txt, com o có-
digo que recebe o voto na web, o vo-
tacao.php, que lê, interpreta e salva
o voto no servidor, e o votos.txt, que
recebe e apresenta o resultado.
No Flash MX 2004, criamos um
arquivo novo e, por meio do menu
Modify/Document, deixamos o do-
cumento com 550 pixels de largura
por 600 de altura. Clicamos em OK
para aplicar as novas medidas.
2. O FUNDO
Agora, renomeamos a única cama-
da da linha do tempo para “fundo”.
Vamos criar um fundo com um gra-
diente em tons de azul. Abrimos o
painel Color Mixer, por
meio do atalho Shift+F9.
Clicamos na seta da es-
querda e escolhemos um
tom de azul-escuro. De-
pois, clicamos na seta da
direita e escolhemos um
tom de azul mais claro.
O gradiente é exibido no
painel Color Mixer.
Com o gradiente mon-
tado, clicamos na ferra-
C O L E Ç Ã O I N F O > 79
TUTORIAL/ VOTAÇÃO 23.05.05 17:27
TUTORIAL/VOTAÇÃO
gular e traçamos um re-
tângulo para cobrir toda
a área do arquivo. Pron-
to, a cor de fundo foi apli-
cada. Para completar o
fundo, importamos a ima-
gem da bola, por meio do
menu File/Import, e a po-
sicionamos no canto su-
perior direito da tela. Por
fim, usamos a ferramen-
ta Linha para desenhar
Organização: camadas facilitam o acesso aos elementos
quatro linhas horizontais
no alto da tela e comple-
tar a diagramação do cabeçalho.
3. O TEXTO E OS BRASÕES
Criamos uma nova camada, de no-
me “texto”, e, com a ferramenta de
texto, digitamos um título para a pá-
gina, a pergunta da votação e o no-
me dos oito times da enquete: Fla-
mengo, Atlético-PR, São Paulo, San-
tos, Corinthians, Vasco, Botafogo e
Palmeiras. Todas as caixas de texto
são do tipo estático.
No painel da linha do tempo, cria-
mos uma camada de nome “escu-
dos” e importamos os ícones com o
brasão de todos os times integrantes
da votação. Depois, usamos a ferra-
menta Seta para posicioná-los ao la-
do do nome de cada equipe.
4. O BOTÃO
Criamos mais uma camada no painel
linha do tempo. Ela tem o nome
“bot_vota” e abrigará o botão de vo-
tação. Nessa camada, acionamos o
menu Window/Common Libraries/
80 < C O L E Ç Ã O I N F O
Page 80
Buttons. No painel Buttons, escolhe-
mos um botão e o arrastamos para
o palco. Na janela de propriedades
do botão, definimos sua cor. Depois,
ainda com o botão selecionado, abri-
mos a janela de ações, por meio da
tecla F9, e digitamos o seguinte có-
digo para o botão:
on (release) {
vota();
} if (timeEscolhido != undefined)
5. O SCRIPT
Mais uma vez, criamos uma cama-
da no painel linha do tempo. Ela se
chama “as” e abrigará o script de
nossa votação. Com o primeiro fra-
me da camada selecionado, abri-
mos a janela de ações, usando o
atalho F9, e colamos o código do
arquivo actionscript.txt, que faz par-
te do arquivo zipado mencionado
no passo 1. Seu conteúdo é:
stop();
controleDados.onData =
function() {
this._parent.nextFrame();
this._parent.result_1_txt.text =
this.fla;
this._parent.result_2_txt.text =
this.atl;
this._parent.result_3_txt.text =
this.sao;
this._parent.result_4_txt.text =
this.san;
this._parent.result_5_txt.text =
this.cor;
this._parent.result_6_txt.text =
this.vas;
this._parent.result_7_txt.text =
this.bot;
this._parent.result_8_txt.text =
this.pal;
};
function escolheTime(val) {
timeEscolhido = val;
todosTimes.gotoAndStop(val+1);
} oito com o escudo dos times.
function vota() {
trace(“vota”);
{ do modo de edição do clipe. Nosso
controleDados.loadVariables
(“votacao.php?voto=”+timeEsco-
lhido, 0, “post”);
}
}
Em resumo, esse có-
digo é o responsável por
passar para o script PHP
os dados do time esco-
lhido pelo internauta.
6. O MOVIE CLIP
Acima da camada “as”,
criamos outra camada
de nome “todos times”. Cena: o primeiro frame vira página de entrada da votação
TUTORIAL/VOTAÇÃO
Ela abrigará o movie clip que rece-
berá o escudo do time escolhido pe-
lo usuário. Com a camada criada, va-
mos gerar o movie clip.
Acionamos o menu Insert/New
Symbol, escolhemos a opção Movie
Clip e clicamos em OK. Estamos ago-
ra no modo de edição do movie clip.
Nesse modo, vamos deixar o primei-
ro keyframe em branco.
Nos oito frames seguintes, inseri-
mos um keyframe em branco, usan-
do a tecla F7, e importamos o escu-
do dos oito times, inserindo um em
cada frame. Utilizamos a janela de
alinhamento, acionada por meio das
teclas Ctrl+K, para garantir que to-
dos os escudos estejam na mesma
posição. Agora, nosso movie clip tem
nove frames: um vazio e os outros
7. A EDIÇÃO
Clicamos no botão Scene 1 para sair
movie clip agora está na Biblioteca
do Flash. Clicamos sobre ele e o ar-
C O L E Ç Ã O I N F O > 81
TUTORIAL/ VOTAÇÃO 23.05.05 17:27
TUTORIAL/VOTAÇÃO
gular e traçamos um re-
tângulo para cobrir toda
a área do arquivo. Pron-
to, a cor de fundo foi apli-
cada. Para completar o
fundo, importamos a ima-
gem da bola, por meio do
menu File/Import, e a po-
sicionamos no canto su-
perior direito da tela. Por
fim, usamos a ferramen-
ta Linha para desenhar
Organização: camadas facilitam o acesso aos elementos
quatro linhas horizontais
no alto da tela e comple-
tar a diagramação do cabeçalho.
3. O TEXTO E OS BRASÕES
Criamos uma nova camada, de no-
me “texto”, e, com a ferramenta de
texto, digitamos um título para a pá-
gina, a pergunta da votação e o no-
me dos oito times da enquete: Fla-
mengo, Atlético-PR, São Paulo, San-
tos, Corinthians, Vasco, Botafogo e
Palmeiras. Todas as caixas de texto
são do tipo estático.
No painel da linha do tempo, cria-
mos uma camada de nome “escu-
dos” e importamos os ícones com o
brasão de todos os times integrantes
da votação. Depois, usamos a ferra-
menta Seta para posicioná-los ao la-
do do nome de cada equipe.
4. O BOTÃO
Criamos mais uma camada no painel
linha do tempo. Ela tem o nome
“bot_vota” e abrigará o botão de vo-
tação. Nessa camada, acionamos o
menu Window/Common Libraries/
80 < C O L E Ç Ã O I N F O
Page 80
Buttons. No painel Buttons, escolhe-
mos um botão e o arrastamos para
o palco. Na janela de propriedades
do botão, definimos sua cor. Depois,
ainda com o botão selecionado, abri-
mos a janela de ações, por meio da
tecla F9, e digitamos o seguinte có-
digo para o botão:
on (release) {
vota();
} if (timeEscolhido != undefined)
5. O SCRIPT
Mais uma vez, criamos uma cama-
da no painel linha do tempo. Ela se
chama “as” e abrigará o script de
nossa votação. Com o primeiro fra-
me da camada selecionado, abri-
mos a janela de ações, usando o
atalho F9, e colamos o código do
arquivo actionscript.txt, que faz par-
te do arquivo zipado mencionado
no passo 1. Seu conteúdo é:
stop();
controleDados.onData =
function() {
this._parent.nextFrame();
this._parent.result_1_txt.text =
this.fla;
this._parent.result_2_txt.text =
this.atl;
this._parent.result_3_txt.text =
this.sao;
this._parent.result_4_txt.text =
this.san;
this._parent.result_5_txt.text =
this.cor;
this._parent.result_6_txt.text =
this.vas;
this._parent.result_7_txt.text =
this.bot;
this._parent.result_8_txt.text =
this.pal;
};
function escolheTime(val) {
timeEscolhido = val;
todosTimes.gotoAndStop(val+1);
} oito com o escudo dos times.
function vota() {
trace(“vota”);
{ do modo de edição do clipe. Nosso
controleDados.loadVariables
(“votacao.php?voto=”+timeEsco-
lhido, 0, “post”);
}
}
Em resumo, esse có-
digo é o responsável por
passar para o script PHP
os dados do time esco-
lhido pelo internauta.
6. O MOVIE CLIP
Acima da camada “as”,
criamos outra camada
de nome “todos times”. Cena: o primeiro frame vira página de entrada da votação
TUTORIAL/VOTAÇÃO
Ela abrigará o movie clip que rece-
berá o escudo do time escolhido pe-
lo usuário. Com a camada criada, va-
mos gerar o movie clip.
Acionamos o menu Insert/New
Symbol, escolhemos a opção Movie
Clip e clicamos em OK. Estamos ago-
ra no modo de edição do movie clip.
Nesse modo, vamos deixar o primei-
ro keyframe em branco.
Nos oito frames seguintes, inseri-
mos um keyframe em branco, usan-
do a tecla F7, e importamos o escu-
do dos oito times, inserindo um em
cada frame. Utilizamos a janela de
alinhamento, acionada por meio das
teclas Ctrl+K, para garantir que to-
dos os escudos estejam na mesma
posição. Agora, nosso movie clip tem
nove frames: um vazio e os outros
7. A EDIÇÃO
Clicamos no botão Scene 1 para sair
movie clip agora está na Biblioteca
do Flash. Clicamos sobre ele e o ar-
C O L E Ç Ã O I N F O > 81
TUTORIAL/ VOTAÇÃO 23.05.05 17:28
TUTORIAL/VOTAÇÃO
rastamos para a cena, dentro da ca-
mada “todos times”.
Acima da camada “todos times”,
criamos a camada “controle”. Ela abri-
gará o movie clip do controle de da-
dos. Nessa camada, acionamos o me-
nu Insert/New Symbol. Escolhemos
o tipo Movie Clip e clicamos em OK.
Depois, clicamos no botão Scene 1
para sair do modo de edição do mo-
vie clip. Ele agora está na bibilioteca.
Arrastamos o movie clip para a ca-
mada “controle” e damos a ele o no-
me de instância “controleDados” na
janela de propriedades.
Esse é o nome de identi-
ficação do movie clip nos
scripts. Posicionamos o
clipe fora da cena.
8. MAIS BOTÕES
Criamos outra camada, a
última de nossa votação.
Ela tem o nome “botoes”
e abrigará os botões invi-
síveis que ficarão sobre o
escudo de cada time. Nes-
sa camada, acionamos o Biblioteca: painel do
menu Insert/New Symbol. Flash abriga os objetos e teclar F5 para adicionar
usados no arquivo
Escolhemos a opção But-
ton e clicamos em OK. Es-
tamos no modo de edição do botão.
Clicamos no estado Hit e criamos
um keyframe em branco, teclando
F7. Nesse keyframe, desenhamos um
círculo. Seu tamanho e cor não im-
portam, pois ele será transparente e
as dimensões poderão ser definidas
depois. Clicamos em Scene para sair
do modo de edição do botão.
82 < C O L E Ç Ã O I N F O
Page 82
Arrastamos oito cópias do botão
para a cena e as posicionamos so-
bre o escudo das equipes. Depois,
selecionamos o botão do primeiro
time e digitamos o seguinte código
on (release) {
escolheTime(1);
}
Repetimos o código para os ou-
tros botões, apenas aumentando o
número entre parênteses em 1. As-
sim, teremos os valores 2, 3, 4, 5, 6,
7, e 8 para os botões restantes.
9.A PÁGINA DE
RESULTADO
A primeira cena de nossa
votação está completa. Te-
mos oito camadas, cada
uma com um só frame.
Vamos agora passar para
o frame 2, que correspon-
de à página de resultado.
As camadas “fundo”, “es-
cudos”, “as” e “controle”
não mudam no segundo
frame. Por isso, basta se-
lecionar cada uma delas
um frame. Assim, seu as-
pecto é mantido. Na ca-
mada “bot_vota”, inserimos um key-
frame em branco no segundo frame
com F7. Repetimos o processo nas
camadas “todos times” e “botoes”.
Na camada “texto”, criamos um
keyframe no segundo frame, por
meio da tecla F6. Trocamos a per-
gunta da votação pelo texto “Confi-
ra o resultado parcial da votação”.
TUTORIAL/ VOTAÇÃO 23.05.05 17:28 Page 83

TUTORIAL/VOTAÇÃO

Depois, criamos uma caixa de texto //voto para o flamengo

ao lado do escudo do primeiro ti- $fla++;
me. Na janela de propriedades da break;
caixa, escolhemos a opção Dynamic case 2 :
Text. Na caixa Instance Name, digi- //voto para o atletico
tamos “result_1_txt”. Essa é a caixa $atl++;
de texto que receberá o número de break;
votos do primeiro time da votação. case 3 :
$sao++;
10. MAIS TEXTO break;
Copiamos e colamos a caixa na cena case 4 :
para criar sete cópias dela, uma pa- $san++;
ra cada time restante. Posicionamos break;
as caixas ao lado de cada time e ape- case 5 :
nas alteramos o nome de instância, $cor++;
aumentando em 1 o algarismo entre break;
as linhas do nome. Assim, temos “re- case 6 :
sult_2_txt”, “result_3_txt”, “result_4_txt”, $vas++;
“result_5_txt”, “result_6_txt”, “re- break;
sult_7_txt” e “result_8_txt”. case 7 :
$bot++;
11. A PUBLICAÇÃO break;
Acionamos o atalho Shift+F12 para case 8 :
publicar os documentos SWF e HTML. $pal++;
Para que a votação funcione, é neces- break;
sário jogar os dois arquivos no mes- }
mo diretório dos arquivos votacao.php
e votos.txt, que fazem parte do arqui- $conteudo=$fla.” “.$atl.”
vo mencionado no passo 1. O código “.$sao.” “.$san.” “.$cor.”
de votacao.php é o seguinte: “.$vas.” “.$bot.” “.$pal;
<?php $arquivo = fopen(“votos.txt”, “w”);
$numBytes = fwrite($arquivo,
$arquivo = fopen(“votos.txt”, “r”); $conteudo);
$buffer = fscanf($arquivo, “%d fclose($arquivo);
%d %d %d %d %d %d %d “, printf(“fla=”.$fla.”&atl=”.$atl.”&
$fla, $atl, $sao, $san, $cor, $vas, sao=”.$sao.”&san=”.$san.”&cor=
$bot, $pal); ”.$cor.”&vas=”.$vas.”&bot=”.$b
fclose($arquivo); ot.”&pal=”.$pal);
switch($voto){ O código de votos.txt é de apenas
case 1 : uma linha: 0 0 0 0 0 0 0 0

C O L E Ç Ã O I N F O > 83
TUTORIAL/ CLASSIFICAÇÃO 23.05.05
TUTORIAL/CLASSIFICAÇÃO
OS SEGREDOS
DO RANKING
NAVEGUE POR UMA LISTA DE GANHADORES CONSTRUÍDA
COM FLASH E XML
POR EVERSON STABENOW SIQUEIRA
m ranking com pagina-
U ção é um recurso indis-
pensável em sites que
apresentam listas de
classificação, como as de empresas
mais lucrativas, ou resultados de
competições, como os de campeo-
natos esportivos e torneios de ga-
mes online. Construir o ranking é
uma outra história e um bom desa-
fio para os desenvolvedores flashei-
ros. Neste tutorial, usamos o Flash
MX para obter as colocações a par-
tir de um arquivo XML. Vamos a ele.
1. DOWNLOADS
Antes de mais nada, baixe o arquivo
zipado Segredos do
Ranking no endereço
www.info.abril.com.
br/download/4194.
shtml. Descompacte
tudo numa mesma
pasta, que não pre-
cisa estar num ser-
vidor web. São quatro
os arquivos: ranking.
fla, com o projeto do
ranking; ranking.swf,
Projeto de ranking: campos duplicados e renomeados
com a lista pronta
84 < C O L E Ç Ã O I N F O
18:58 Page 84
para testar; ranking.as, com o
ActionScript, e ranking.xml, com o
exemplo de listagem.
Para alívio dos iniciantes, eis o pri-
meiro segredo: tanto faz qual a lin-
guagem de programação que você
usa. Para o Flash vale apenas a saída
de dados, que é escrita pelo servidor
com um script. Então, vamos nos con-
centrar no Flash e no ActionScript ne-
cessário para processar a saída XML.
2. XML ESTÁTICO
É mais fácil resolver um problema
de cada vez. Logo, embora o site se-
ja dinâmico, vamos começar com
um XML estático.
No arquivo ZIP que você baixou,
já está tudo funcionando. Então
duplique a pasta descompactada
e trabalhe na cópia. Assim você
pode comparar os arquivos caso
algo saia errado.
No Flash MX, crie um novo arqui-
vo. Use 400 x 300 pixels para as di-
mensões do documento e salve com
o nome “ranking.fla”.
3. MOVIECLIP
Uma lista de ganhadores costuma
ser apenas parte de um projeto
Flash. Exemplo: a competição aca-
ba, e aparece uma tela com os re-
cordistas. Então tudo o que faremos
a partir de agora será dentro de um
único MovieClip, que só depois irá
para a linha do tempo principal.
Clique no menu Insert/New
Symbol e dê o nome “ranking” pa-
ra este novo MovieClip. Selecio-
ne o primeiro quadro do ranking
e tecle F9 para aparecer a janela
de ActionScript. Nela, você digi-
tará a única linha de código de
nosso arquivo .fla:
#include “as/ranking.as”
Se não conseguir digitar, mude para
“expert mode”, teclando Ctrl+
Shift+E.
4. TEXTO DINÂMICO
Ainda dentro da área do MovieClip
“ranking”, selecione a ferramenta
de texto. Na barra de proprieda-
des, mude a opção do primeiro me-
nu suspenso para DynamicText. Mu-
de também a fonte para _sans, cor-
TUTORIAL/CLASSIFICAÇÃO
po 12, preto. Crie então o campo de
texto, ocupando apenas uma linha.
Logo em seguida, na barra de pro-
priedades, daremos um nome pa-
ra esse campo: “nome1”.
Duplique o campo (selecione e
tecle Ctrl+D) várias vezes até for-
mar uma coluna com dez campos.
Mude o nome de cada um deles,
na seqüência, de “nome1” até “no-
me10”. Essa coluna mostrará os
nomes dos colocados.
Com o mouse, selecione todos os
campos e duplique-os (Ctrl+D), crian-
do uma segunda coluna, para os
pontos, à direita da anterior. Mude
também os nomes desses campos,
agora com os nomes de “pontos1”
a “pontos10”. Você também pode
diminuir a largura dos campos.
Duplique novamente uma das
colunas e coloque-a totalmente à
esquerda, para indicar a posição
de cada nome no ranking. Mais
uma vez, mude os nomes desses
dez campos, seguindo o padrão de
“pos1” a “pos10”.
Botão: o nome certo é fundamental
5. OS BOTÕES
Logo abaixo das três colunas com os
campos, crie dois botões: um para a
esquerda e outro para a direita. Dê
os nomes “anterior” para o botão da
C O L E Ç Ã O I N F O > 85
TUTORIAL/ CLASSIFICAÇÃO 23.05.05
TUTORIAL/CLASSIFICAÇÃO
OS SEGREDOS
DO RANKING
NAVEGUE POR UMA LISTA DE GANHADORES CONSTRUÍDA
COM FLASH E XML
POR EVERSON STABENOW SIQUEIRA
m ranking com pagina-
U ção é um recurso indis-
pensável em sites que
apresentam listas de
classificação, como as de empresas
mais lucrativas, ou resultados de
competições, como os de campeo-
natos esportivos e torneios de ga-
mes online. Construir o ranking é
uma outra história e um bom desa-
fio para os desenvolvedores flashei-
ros. Neste tutorial, usamos o Flash
MX para obter as colocações a par-
tir de um arquivo XML. Vamos a ele.
1. DOWNLOADS
Antes de mais nada, baixe o arquivo
zipado Segredos do
Ranking no endereço
www.info.abril.com.
br/download/4194.
shtml. Descompacte
tudo numa mesma
pasta, que não pre-
cisa estar num ser-
vidor web. São quatro
os arquivos: ranking.
fla, com o projeto do
ranking; ranking.swf,
Projeto de ranking: campos duplicados e renomeados
com a lista pronta
84 < C O L E Ç Ã O I N F O
18:58 Page 84
para testar; ranking.as, com o
ActionScript, e ranking.xml, com o
exemplo de listagem.
Para alívio dos iniciantes, eis o pri-
meiro segredo: tanto faz qual a lin-
guagem de programação que você
usa. Para o Flash vale apenas a saída
de dados, que é escrita pelo servidor
com um script. Então, vamos nos con-
centrar no Flash e no ActionScript ne-
cessário para processar a saída XML.
2. XML ESTÁTICO
É mais fácil resolver um problema
de cada vez. Logo, embora o site se-
ja dinâmico, vamos começar com
um XML estático.
No arquivo ZIP que você baixou,
já está tudo funcionando. Então
duplique a pasta descompactada
e trabalhe na cópia. Assim você
pode comparar os arquivos caso
algo saia errado.
No Flash MX, crie um novo arqui-
vo. Use 400 x 300 pixels para as di-
mensões do documento e salve com
o nome “ranking.fla”.
3. MOVIECLIP
Uma lista de ganhadores costuma
ser apenas parte de um projeto
Flash. Exemplo: a competição aca-
ba, e aparece uma tela com os re-
cordistas. Então tudo o que faremos
a partir de agora será dentro de um
único MovieClip, que só depois irá
para a linha do tempo principal.
Clique no menu Insert/New
Symbol e dê o nome “ranking” pa-
ra este novo MovieClip. Selecio-
ne o primeiro quadro do ranking
e tecle F9 para aparecer a janela
de ActionScript. Nela, você digi-
tará a única linha de código de
nosso arquivo .fla:
#include “as/ranking.as”
Se não conseguir digitar, mude para
“expert mode”, teclando Ctrl+
Shift+E.
4. TEXTO DINÂMICO
Ainda dentro da área do MovieClip
“ranking”, selecione a ferramenta
de texto. Na barra de proprieda-
des, mude a opção do primeiro me-
nu suspenso para DynamicText. Mu-
de também a fonte para _sans, cor-
TUTORIAL/CLASSIFICAÇÃO
po 12, preto. Crie então o campo de
texto, ocupando apenas uma linha.
Logo em seguida, na barra de pro-
priedades, daremos um nome pa-
ra esse campo: “nome1”.
Duplique o campo (selecione e
tecle Ctrl+D) várias vezes até for-
mar uma coluna com dez campos.
Mude o nome de cada um deles,
na seqüência, de “nome1” até “no-
me10”. Essa coluna mostrará os
nomes dos colocados.
Com o mouse, selecione todos os
campos e duplique-os (Ctrl+D), crian-
do uma segunda coluna, para os
pontos, à direita da anterior. Mude
também os nomes desses campos,
agora com os nomes de “pontos1”
a “pontos10”. Você também pode
diminuir a largura dos campos.
Duplique novamente uma das
colunas e coloque-a totalmente à
esquerda, para indicar a posição
de cada nome no ranking. Mais
uma vez, mude os nomes desses
dez campos, seguindo o padrão de
“pos1” a “pos10”.
Botão: o nome certo é fundamental
5. OS BOTÕES
Logo abaixo das três colunas com os
campos, crie dois botões: um para a
esquerda e outro para a direita. Dê
os nomes “anterior” para o botão da
C O L E Ç Ã O I N F O > 85
TUTORIAL/ CLASSIFICAÇÃO 23.05.05
TUTORIAL/CLASSIFICAÇÃO
esquerda e “proxima” para o da di-
reita. Isso é importante porque se o
botão não tiver o nome certo não irá
funcionar. Neste tutorial, utilizamos
botões que já vêm com o Flash, acio-
nando o menu Window/Common
Libraries/Buttons.
6. FILME NO PALCO
Até aqui, tudo foi feito dentro do
MovieClip “ranking”. Voltando para
a linha do tempo principal (abaixo
dos frames, clique em scene1), nos-
so projeto fica novamente vazio.
Abra a Library (tecle Ctrl+L ou F11),
arraste o ranking para a área de tra-
balho e ajuste a posição para ficar
bonitinho. Tudo o que tínhamos a
fazer dentro do Flash está pronto.
Salve o arquivo. Se quiser enfeitar
o documento na linha do tempo
principal, fique à vontade.
7. O TESTE
Se você fez tudo certo e salvou
seu ranking.fla com o ranking.as e o
ranking.xml, que entregamos de ban-
deja, basta testar, teclando Ctrl+Enter.
Agora que você testou e experi-
mentou os botões de próxima e an-
terior, vamos entender como tudo
isso funciona.
Alguns programadores gostam
muito de editar os ActionScrips fora
do Flash, salvando-os em arquivos
.as. Com isso, podemos usar o editor
de textos preferido e reaproveitar
mais facilmente os mesmos scripts
em vários projetos (é fato que tam-
bém se perdem várias facilidades que
86 < C O L E Ç Ã O I N F O
18:58 Page 86
o editor interno do Flash oferece).
Note que, por meio de um só ar-
quivo de ActionScript, também pu-
demos criar toda a funcionalida-
de do projeto, em vez de ter o có-
digo espalhado dentro do Flash,
em vários objetos. Mas para que
isso tudo funcione é muito impor-
tante que cada objeto tenha seu
próprio nome. Por meio dos no-
mes pode-se programar o compor-
tamento de cada item, e alterar
seus valores e propriedades.
8. UM XML
MELHORADO
Grosso modo, o XML nada mais é
do que um arquivo de texto onde
as informações são descritas e or-
ganizadas. Por meio de tags (o que
lembra muito um HTML), cria-se
uma hierarquia de dados. Uma in-
formação pode ser a mãe de outras
informações, como numa árvore
genealógica. O nome correto para
cada participante dessa árvore é nó
(node, em inglês).
Para o Flash mostrar informações
de um XML deve-se primeiro car-
regar o XML, o que é fácil. Depois,
caminha-se de um nó para outro
pela hierarquia. Cada nó dá acesso
aos seus filhos através de proprieda-
des como childNodes, ou firstChild.
Então já não é mais tão simples. Por
essa razão, nosso ranking faz uma
melhoria na classe XMLnode do
Flash (sim, isto é possível). Acres-
centamos o método “getNodes-
ByName” para os nós de XML no
Flash. Com esse ajuste fino, fi-
ca fácil retornar um arranjo
com todos os nós desejados.
Importante: para usar a fun-
ção getNodesByName em seus
novos arquivos .fla com XML,
não esqueça de incluir o códi-
go que expande a funcionali-
dade do XMLnode.
Arraste o arquivo ranking.xml
para seu navegador favorito Ranking: funcionalidade em um ActionScript
e veja como ele é organizado.
Existem vários nomes com acen-
tuação e com diferentes compri-
mentos. Em seus projetos, produ-
za arquivos de teste variados, co-
mo o ranking.xml. Isso ajuda a
identificar problemas muito mais
rapidamente do que se tivesse es-
crito “nome1 a nomeX”. Veja tam-
bém que o XML pode conter infor-
mações adicionais que você não
esteja usando — é o caso dos en-
dereços de site, existentes em ape-
nas três colocados.
9. CÓDIGO .AS
O código ranking.as possui comen-
tários explicativos. Primeiro, definem- o caminho do XML para algo como
se todas as funções. Só no final é que ranking.php ou ranking.asp, de
mandamos carregar o XML, e tudo
acontece a partir daí.
Tudo está amarrado com o Mo-
vieClip “ranking”. Você tem total
liberdade para criar o que quiser
na linha do tempo principal, sem
se preocupar com nomes de variá-
veis. No momento em que o ranking
aparecer na linha do tempo, ele fa-
rá seu trabalho.
TUTORIAL/CLASSIFICAÇÃO
10. MAIS TREINO
Existem várias possibilidades pa-
ra você treinar suas habilidades
com o Flash:
A. Tente acrescentar pequenos bo-
tões ao lado das colunas de pontua-
ção. Mostre os botões nos coloca-
dos que tiverem endereço de site e
esconda-os nos que não tiverem;
B. Se você já configurou seu web-
server e banco de dados, tente criar
uma tabela no banco com os colo-
cados. Use sua linguagem favori-
ta e reescreva o XML para ser real-
mente dinâmico. Não esqueça de
alterar na configuração do script
acordo com a linguagem de pro-
gramação que estiver usando.
O ranking atual obtém todos os
valores do XML numa só tacada —
isso funciona bem para algumas
centenas de colocados. Se fossem
milhares de itens, seria necessário
obter a lista aos poucos. Difícil?
Nada que um flasheiro experiente
não possa resolver.
C O L E Ç Ã O I N F O > 87
TUTORIAL/ CLASSIFICAÇÃO 23.05.05
TUTORIAL/CLASSIFICAÇÃO
esquerda e “proxima” para o da di-
reita. Isso é importante porque se o
botão não tiver o nome certo não irá
funcionar. Neste tutorial, utilizamos
botões que já vêm com o Flash, acio-
nando o menu Window/Common
Libraries/Buttons.
6. FILME NO PALCO
Até aqui, tudo foi feito dentro do
MovieClip “ranking”. Voltando para
a linha do tempo principal (abaixo
dos frames, clique em scene1), nos-
so projeto fica novamente vazio.
Abra a Library (tecle Ctrl+L ou F11),
arraste o ranking para a área de tra-
balho e ajuste a posição para ficar
bonitinho. Tudo o que tínhamos a
fazer dentro do Flash está pronto.
Salve o arquivo. Se quiser enfeitar
o documento na linha do tempo
principal, fique à vontade.
7. O TESTE
Se você fez tudo certo e salvou
seu ranking.fla com o ranking.as e o
ranking.xml, que entregamos de ban-
deja, basta testar, teclando Ctrl+Enter.
Agora que você testou e experi-
mentou os botões de próxima e an-
terior, vamos entender como tudo
isso funciona.
Alguns programadores gostam
muito de editar os ActionScrips fora
do Flash, salvando-os em arquivos
.as. Com isso, podemos usar o editor
de textos preferido e reaproveitar
mais facilmente os mesmos scripts
em vários projetos (é fato que tam-
bém se perdem várias facilidades que
86 < C O L E Ç Ã O I N F O
18:58 Page 86
o editor interno do Flash oferece).
Note que, por meio de um só ar-
quivo de ActionScript, também pu-
demos criar toda a funcionalida-
de do projeto, em vez de ter o có-
digo espalhado dentro do Flash,
em vários objetos. Mas para que
isso tudo funcione é muito impor-
tante que cada objeto tenha seu
próprio nome. Por meio dos no-
mes pode-se programar o compor-
tamento de cada item, e alterar
seus valores e propriedades.
8. UM XML
MELHORADO
Grosso modo, o XML nada mais é
do que um arquivo de texto onde
as informações são descritas e or-
ganizadas. Por meio de tags (o que
lembra muito um HTML), cria-se
uma hierarquia de dados. Uma in-
formação pode ser a mãe de outras
informações, como numa árvore
genealógica. O nome correto para
cada participante dessa árvore é nó
(node, em inglês).
Para o Flash mostrar informações
de um XML deve-se primeiro car-
regar o XML, o que é fácil. Depois,
caminha-se de um nó para outro
pela hierarquia. Cada nó dá acesso
aos seus filhos através de proprieda-
des como childNodes, ou firstChild.
Então já não é mais tão simples. Por
essa razão, nosso ranking faz uma
melhoria na classe XMLnode do
Flash (sim, isto é possível). Acres-
centamos o método “getNodes-
ByName” para os nós de XML no
Flash. Com esse ajuste fino, fi-
ca fácil retornar um arranjo
com todos os nós desejados.
Importante: para usar a fun-
ção getNodesByName em seus
novos arquivos .fla com XML,
não esqueça de incluir o códi-
go que expande a funcionali-
dade do XMLnode.
Arraste o arquivo ranking.xml
para seu navegador favorito Ranking: funcionalidade em um ActionScript
e veja como ele é organizado.
Existem vários nomes com acen-
tuação e com diferentes compri-
mentos. Em seus projetos, produ-
za arquivos de teste variados, co-
mo o ranking.xml. Isso ajuda a
identificar problemas muito mais
rapidamente do que se tivesse es-
crito “nome1 a nomeX”. Veja tam-
bém que o XML pode conter infor-
mações adicionais que você não
esteja usando — é o caso dos en-
dereços de site, existentes em ape-
nas três colocados.
9. CÓDIGO .AS
O código ranking.as possui comen-
tários explicativos. Primeiro, definem- o caminho do XML para algo como
se todas as funções. Só no final é que ranking.php ou ranking.asp, de
mandamos carregar o XML, e tudo
acontece a partir daí.
Tudo está amarrado com o Mo-
vieClip “ranking”. Você tem total
liberdade para criar o que quiser
na linha do tempo principal, sem
se preocupar com nomes de variá-
veis. No momento em que o ranking
aparecer na linha do tempo, ele fa-
rá seu trabalho.
TUTORIAL/CLASSIFICAÇÃO
10. MAIS TREINO
Existem várias possibilidades pa-
ra você treinar suas habilidades
com o Flash:
A. Tente acrescentar pequenos bo-
tões ao lado das colunas de pontua-
ção. Mostre os botões nos coloca-
dos que tiverem endereço de site e
esconda-os nos que não tiverem;
B. Se você já configurou seu web-
server e banco de dados, tente criar
uma tabela no banco com os colo-
cados. Use sua linguagem favori-
ta e reescreva o XML para ser real-
mente dinâmico. Não esqueça de
alterar na configuração do script
acordo com a linguagem de pro-
gramação que estiver usando.
O ranking atual obtém todos os
valores do XML numa só tacada —
isso funciona bem para algumas
centenas de colocados. Se fossem
milhares de itens, seria necessário
obter a lista aos poucos. Difícil?
Nada que um flasheiro experiente
não possa resolver.
C O L E Ç Ã O I N F O > 87
TUTORIAL/ E-COMMERCE 23.05.05 17:52
TUTORIAL/E-COMMERCE
LOJA COM UM
FLASH SIMPLES
VEJA COMO CRIAR PÁGINAS NO SWISHMAX, UM SUBSTITUTO
DESCOMPLICADO PARA O FLASH MX 2004
POR ANDRÉ CARDOZO
complexidade do Flash
A MX 2004 muitas vezes
desanima os iniciantes
nos mistérios do desen-
volvimento de sites. Uma opção mais
simples é o SWISHmax (www.info.
abril.com.br/download/3612.shtml).
Esse aplicativo, um shareware da
SwishZone, exporta arquivos em for-
mato SWF, não tem todos os recur-
sos do Flash MX 2004, mas dá conta
do recado em tarefas menos comple-
xas. Este tutorial mostrará como criar
um layout de site de comércio eletrô-
nico no SWISHmax. Além da home
page, serão criados os layouts das se-
ções do site e o sistema de navega-
ção. Os arquivos deste exemplo po-
dem ser baixados em www.info.
abril.com.br/download/4048.shtml.
1. DEFINIR AS DIMENSÕES
Abrimos o SWISHmax com um arqui-
vo em branco. Nos painéis do canto
direito, clicamos na aba Movie e de-
finimos a largura da cena em 700 pi-
xels e a altura em 575 pixels. Ainda
na aba Movie, clicamos em Back-
ground Color para escolher a cor de
fundo — escolhemos um tom de azul.
88 < C O L E Ç Ã O I N F O
Page 88
Acionamos o menu View/Fit Sce-
ne in Window para visualizar a cena
melhor. Também clicamos no ícone
Scene_1, no painel de componentes,
e mudamos seu nome para Home.
2. PRIMEIRA BARRA
Vamos começar o layout pela barra
de navegação superior, que contém
o logotipo e links para serviços. Por
meio do menu File/Import, importa-
mos as imagens do logotipo e dos
seis botões que compõem a barra su-
perior. As imagens aparecem empi-
lhadas. Por isso, clicamos fora delas
e depois novamente numa das ima-
gens para separá-las. Arrastando o
mouse, clicamos e posicionamos as
imagens na parte superior da cena.
Para auxiliar no alinhamento, usa-
mos as guias, clicando sobre as ré-
guas que contornam a área de tra-
balho e arrastando as guias. Nosso
logotipo tem 60 pixels de altura. Por
isso, a barra superior terá 70 pixels.
3. SEGUNDA BARRA
Passamos para a segunda barra de
navegação, que fica abaixo da cria-
da no passo 2 e contém os links pa-
ra as quatro seções do site: câmeras,
celulares, armazenamento e televi-
sores. Clicamos na ferramenta retân-
gulo. Surge o painel Shape. Nele, al-
teramos a cor do retângulo a ser de-
senhado — usamos o hexadecimal
FF8200, um tom de laranja. Também
incluímos uma borda preta de espes-
sura 1. Desenhamos então um retân-
gulo de 20 pixels de altura e 700 de
largura logo abaixo do logotipo.
4. MIOLO DA PÁGINA
Com as barras superiores prontas,
passamos para o miolo da página.
Traçamos um retângulo branco com
a borda preta de espessura 1 para co-
brir toda a parte inferior da cena,
abaixo da barra laranja do passo an-
terior. Nossa home agora tem três
áreas horizontais: uma de cor azul,
uma segunda faixa estreita laranja e
uma grande área branca.
Nessa área branca, vamos fazer, à
esquerda, o menu vertical com links
complementares. Esse menu terá o
mesmo tom de azul da barra em que
Imagens: propriedades são exibidas no painel Shape
TUTORIAL/E-COMMERCE
está o logotipo. Por isso, desenha-
mos um retângulo de cor 529ACE (o
mesmo valor usado no passo 1), 145
pixels de largura e a altura necessá-
ria para chegar até o fim da cena.
Com isso, criamos uma área de cor
azul do lado esquerdo da tela.
5. IMPORTAÇÃO DE IMAGENS
A área branca na parte central será
preenchida com imagens de produ-
tos e seus respectivos textos descri-
tivos e preços. Com o auxílio das guias,
dividimos a área branca em três par-
tes iguais. Nelas, usamos novamen-
te o menu File/Import para importar
as imagens dos produtos e as distri-
buímos igualmente pela cena.
6. OS TEXTOS
Haverá textos nos menus horizontal
e vertical e no miolo da cena para
descrever os produtos. Para inserir
os itens do menu lateral, clicamos na
ferramenta de texto, indicada pelo
ícone T na barra de ferramentas. Sur-
ge, à direita da área de trabalho, o
painel Text, com uma
grande área em branco
para entrada de texto. Di-
gitamos ali o texto do me-
nu lateral, com catego-
rias e subcategorias.
Usando as caixas de op-
ção logo acima da área
de texto, escolhemos a
fonte e o tamanho, no
nosso caso Verdana 12.
Depois de tudo pronto
no painel Text, clicamos
C O L E Ç Ã O I N F O > 89
TUTORIAL/ E-COMMERCE 23.05.05 17:52
TUTORIAL/E-COMMERCE
LOJA COM UM
FLASH SIMPLES
VEJA COMO CRIAR PÁGINAS NO SWISHMAX, UM SUBSTITUTO
DESCOMPLICADO PARA O FLASH MX 2004
POR ANDRÉ CARDOZO
complexidade do Flash
A MX 2004 muitas vezes
desanima os iniciantes
nos mistérios do desen-
volvimento de sites. Uma opção mais
simples é o SWISHmax (www.info.
abril.com.br/download/3612.shtml).
Esse aplicativo, um shareware da
SwishZone, exporta arquivos em for-
mato SWF, não tem todos os recur-
sos do Flash MX 2004, mas dá conta
do recado em tarefas menos comple-
xas. Este tutorial mostrará como criar
um layout de site de comércio eletrô-
nico no SWISHmax. Além da home
page, serão criados os layouts das se-
ções do site e o sistema de navega-
ção. Os arquivos deste exemplo po-
dem ser baixados em www.info.
abril.com.br/download/4048.shtml.
1. DEFINIR AS DIMENSÕES
Abrimos o SWISHmax com um arqui-
vo em branco. Nos painéis do canto
direito, clicamos na aba Movie e de-
finimos a largura da cena em 700 pi-
xels e a altura em 575 pixels. Ainda
na aba Movie, clicamos em Back-
ground Color para escolher a cor de
fundo — escolhemos um tom de azul.
88 < C O L E Ç Ã O I N F O
Page 88
Acionamos o menu View/Fit Sce-
ne in Window para visualizar a cena
melhor. Também clicamos no ícone
Scene_1, no painel de componentes,
e mudamos seu nome para Home.
2. PRIMEIRA BARRA
Vamos começar o layout pela barra
de navegação superior, que contém
o logotipo e links para serviços. Por
meio do menu File/Import, importa-
mos as imagens do logotipo e dos
seis botões que compõem a barra su-
perior. As imagens aparecem empi-
lhadas. Por isso, clicamos fora delas
e depois novamente numa das ima-
gens para separá-las. Arrastando o
mouse, clicamos e posicionamos as
imagens na parte superior da cena.
Para auxiliar no alinhamento, usa-
mos as guias, clicando sobre as ré-
guas que contornam a área de tra-
balho e arrastando as guias. Nosso
logotipo tem 60 pixels de altura. Por
isso, a barra superior terá 70 pixels.
3. SEGUNDA BARRA
Passamos para a segunda barra de
navegação, que fica abaixo da cria-
da no passo 2 e contém os links pa-
ra as quatro seções do site: câmeras,
celulares, armazenamento e televi-
sores. Clicamos na ferramenta retân-
gulo. Surge o painel Shape. Nele, al-
teramos a cor do retângulo a ser de-
senhado — usamos o hexadecimal
FF8200, um tom de laranja. Também
incluímos uma borda preta de espes-
sura 1. Desenhamos então um retân-
gulo de 20 pixels de altura e 700 de
largura logo abaixo do logotipo.
4. MIOLO DA PÁGINA
Com as barras superiores prontas,
passamos para o miolo da página.
Traçamos um retângulo branco com
a borda preta de espessura 1 para co-
brir toda a parte inferior da cena,
abaixo da barra laranja do passo an-
terior. Nossa home agora tem três
áreas horizontais: uma de cor azul,
uma segunda faixa estreita laranja e
uma grande área branca.
Nessa área branca, vamos fazer, à
esquerda, o menu vertical com links
complementares. Esse menu terá o
mesmo tom de azul da barra em que
Imagens: propriedades são exibidas no painel Shape
TUTORIAL/E-COMMERCE
está o logotipo. Por isso, desenha-
mos um retângulo de cor 529ACE (o
mesmo valor usado no passo 1), 145
pixels de largura e a altura necessá-
ria para chegar até o fim da cena.
Com isso, criamos uma área de cor
azul do lado esquerdo da tela.
5. IMPORTAÇÃO DE IMAGENS
A área branca na parte central será
preenchida com imagens de produ-
tos e seus respectivos textos descri-
tivos e preços. Com o auxílio das guias,
dividimos a área branca em três par-
tes iguais. Nelas, usamos novamen-
te o menu File/Import para importar
as imagens dos produtos e as distri-
buímos igualmente pela cena.
6. OS TEXTOS
Haverá textos nos menus horizontal
e vertical e no miolo da cena para
descrever os produtos. Para inserir
os itens do menu lateral, clicamos na
ferramenta de texto, indicada pelo
ícone T na barra de ferramentas. Sur-
ge, à direita da área de trabalho, o
painel Text, com uma
grande área em branco
para entrada de texto. Di-
gitamos ali o texto do me-
nu lateral, com catego-
rias e subcategorias.
Usando as caixas de op-
ção logo acima da área
de texto, escolhemos a
fonte e o tamanho, no
nosso caso Verdana 12.
Depois de tudo pronto
no painel Text, clicamos
C O L E Ç Ã O I N F O > 89
TUTORIAL/ E-COMMERCE 23.05.05 17:53 Page 90

TUTORIAL/E-COMMERCE TUTORIAL/E-COMMERCE

na área do menu lateral on(press) { Damos o nome de “cameras” à no-

para aplicar o texto e ar- gotoSceneAndStop va cena e apagamos todos os obje-
rastamos o mouse até a (“armazenamento”, 1); tos do miolo. A seção destacará três
largura desejada. } modelos. Por isso, usamos guias pa-
Novamente, clicamos on(press) { ra dividir o miolo da cena em três
na ferramenta de texto e gotoSceneAndStop(“celulares”, 1); partes. Depois, acionamos o menu
usamos o painel Text pa- } File/Import para inserir as imagens.
ra criar as chamadas dos on(press) {
produtos. Copiamos e co- gotoSceneAndStop(“televisores”, 10. AS DESCRIÇÕES
lamos a caixa de texto do 1); Com as imagens posicionadas, inse-
primeiro produto, alteran- } rimos a descrição do primeiro pro-
do as descrições e as po- Diagramação: guias auxiliam no posicionamento Criamos um quinto botão e o po- duto. Digitamos o texto no painel Text
sições na área de traba- sicionamos sobre o logo para que o e clicamos e arrastamos o mouse pa-
lho até que todas as seis imagens te- Com o ícone Button selecionado na usuário possa retornar à home. Na ra aplicar a descrição. A página de
nham seus textos. janela de componentes, acionamos aba script, inserimos o código: câmeras está pronta. Aproveitamos
Os últimos textos a serem inseri- o menu Modify/Grouping/Group as on(press) { a estrutura dela para criar as outras.
dos são os da barra de navegação Button. O quadrado muda de forma, gotoSceneAndStop(“home”, 1); Para fazer isso, ativamos a opção Copy
horizontal. Clicamos na ferramenta indicando que é agora um botão. } Scene e, depois, Paste Scene. Faze-
de texto e usamos o painel Text pa- Com o quadrado selecionado, cli- Este é o link para a home do site. mos isso três vezes. Selecionamos
ra digitar o título das seções. Usamos camos na aba Script, acionamos o cada cena e teclamos F2 para
a fonte Verdana branca e o tamanho modo Expert e digitamos o seguinte 9. QUATRO SEÇÕES renomeá-las como “armazenamen-
12. Copiamos e colamos a caixa do trecho abaixo: A home page está pronta. Vamos pa- to”, “televisores” e “celulares”. Entra-
primeiro nome de seção para facili- on(press) { ra as páginas das quatro seções do mos em cada uma e editamos textos
tar a inserção dos outros textos. gotoSceneAndStop(“cameras”, 1); site: Câmeras, Celulares, Armazena- e imagens e salvamos o arquivo.
} mento e Televisores. Co-
7. BOTÕES DE NAVEGAÇÃO Com isso, criamos um botão trans- mo as áreas de navega-
Para completar a home, faltam ape- parente que, ao ser clicado, envia o ção são constantes, mu-
nas os botões que permitirão a na- internauta à cena “cameras”, que cor- damos apenas o miolo da
vegação entre as seções do site. Eles responde à seção Câmeras do site. cena. Para a criação da
serão transparentes e ficarão sobre seção de câmeras, clica-
os nomes da barra de navegação. 8.MAIS BOTÕES mos, com o botão direi-
Para criar o primeiro botão, aces- Para facilitar a criação dos outros bo- to, na raiz da cena “ho-
samos o menu Insert/Button. Surge tões, apenas copiamos e colamos o me”, no painel de com-
um quadrado azul e, do lado esquer- botão criado no passo anterior. A úni- ponentes, e ativamos a
do, na janela de componentes, apa- ca alteração a ser feita é na janela de opção Copy Scene. De-
rece um ícone de nome Button. script. Substituímos a palavra “came- pois, clicamos, com o bo-
Arrastamos o quadrado para cima ras” pelo nome das cenas correspon- tão direito, em qualquer
da palavra “Câmeras”, no menu ho- dentes às outras seções do site. As- lugar da janela de com-
rizontal, e usamos as alças para sim, temos os seguintes códigos pa- ponentes e escolhemos
redimensioná-lo, cobrindo a palavra. ra os botões das outras três seções: Paste Scene. Resultado: o site é aberto dentro do Flash Player

90 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 91
TUTORIAL/ E-COMMERCE 23.05.05 17:53 Page 90

TUTORIAL/E-COMMERCE TUTORIAL/E-COMMERCE

na área do menu lateral on(press) { Damos o nome de “cameras” à no-

para aplicar o texto e ar- gotoSceneAndStop va cena e apagamos todos os obje-
rastamos o mouse até a (“armazenamento”, 1); tos do miolo. A seção destacará três
largura desejada. } modelos. Por isso, usamos guias pa-
Novamente, clicamos on(press) { ra dividir o miolo da cena em três
na ferramenta de texto e gotoSceneAndStop(“celulares”, 1); partes. Depois, acionamos o menu
usamos o painel Text pa- } File/Import para inserir as imagens.
ra criar as chamadas dos on(press) {
produtos. Copiamos e co- gotoSceneAndStop(“televisores”, 10. AS DESCRIÇÕES
lamos a caixa de texto do 1); Com as imagens posicionadas, inse-
primeiro produto, alteran- } rimos a descrição do primeiro pro-
do as descrições e as po- Diagramação: guias auxiliam no posicionamento Criamos um quinto botão e o po- duto. Digitamos o texto no painel Text
sições na área de traba- sicionamos sobre o logo para que o e clicamos e arrastamos o mouse pa-
lho até que todas as seis imagens te- Com o ícone Button selecionado na usuário possa retornar à home. Na ra aplicar a descrição. A página de
nham seus textos. janela de componentes, acionamos aba script, inserimos o código: câmeras está pronta. Aproveitamos
Os últimos textos a serem inseri- o menu Modify/Grouping/Group as on(press) { a estrutura dela para criar as outras.
dos são os da barra de navegação Button. O quadrado muda de forma, gotoSceneAndStop(“home”, 1); Para fazer isso, ativamos a opção Copy
horizontal. Clicamos na ferramenta indicando que é agora um botão. } Scene e, depois, Paste Scene. Faze-
de texto e usamos o painel Text pa- Com o quadrado selecionado, cli- Este é o link para a home do site. mos isso três vezes. Selecionamos
ra digitar o título das seções. Usamos camos na aba Script, acionamos o cada cena e teclamos F2 para
a fonte Verdana branca e o tamanho modo Expert e digitamos o seguinte 9. QUATRO SEÇÕES renomeá-las como “armazenamen-
12. Copiamos e colamos a caixa do trecho abaixo: A home page está pronta. Vamos pa- to”, “televisores” e “celulares”. Entra-
primeiro nome de seção para facili- on(press) { ra as páginas das quatro seções do mos em cada uma e editamos textos
tar a inserção dos outros textos. gotoSceneAndStop(“cameras”, 1); site: Câmeras, Celulares, Armazena- e imagens e salvamos o arquivo.
} mento e Televisores. Co-
7. BOTÕES DE NAVEGAÇÃO Com isso, criamos um botão trans- mo as áreas de navega-
Para completar a home, faltam ape- parente que, ao ser clicado, envia o ção são constantes, mu-
nas os botões que permitirão a na- internauta à cena “cameras”, que cor- damos apenas o miolo da
vegação entre as seções do site. Eles responde à seção Câmeras do site. cena. Para a criação da
serão transparentes e ficarão sobre seção de câmeras, clica-
os nomes da barra de navegação. 8.MAIS BOTÕES mos, com o botão direi-
Para criar o primeiro botão, aces- Para facilitar a criação dos outros bo- to, na raiz da cena “ho-
samos o menu Insert/Button. Surge tões, apenas copiamos e colamos o me”, no painel de com-
um quadrado azul e, do lado esquer- botão criado no passo anterior. A úni- ponentes, e ativamos a
do, na janela de componentes, apa- ca alteração a ser feita é na janela de opção Copy Scene. De-
rece um ícone de nome Button. script. Substituímos a palavra “came- pois, clicamos, com o bo-
Arrastamos o quadrado para cima ras” pelo nome das cenas correspon- tão direito, em qualquer
da palavra “Câmeras”, no menu ho- dentes às outras seções do site. As- lugar da janela de com-
rizontal, e usamos as alças para sim, temos os seguintes códigos pa- ponentes e escolhemos
redimensioná-lo, cobrindo a palavra. ra os botões das outras três seções: Paste Scene. Resultado: o site é aberto dentro do Flash Player

90 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 91
TUTORIAL/ RSS 24.05.05 12:43 Page 92

TUTORIAL/RSS TUTORIAL/RSS

SITE ESPERTO
mento. Ele tem três partes básicas:
versões, identificação e notícias.
1.
LÊ OS FEEDS
AS VERSÕES
O primeiro passo é informar as ver-
sões do XML e do RSS utilizadas no
O RSS É UMA ÓTIMA FERRAMENTA PARA ATRAIR documento com as seguintes tags:
VISITANTES E TAMBÉM ATUALIZAR O SITE
POR ANDRÉ CARDOZO <?xml version=“1.0” encoding=
“ISO-8859-1” ?>
odo webmaster faz o que quivo RSS é saber qual versão usar. <!DOCTYPE rss PUBLIC
<description>Tecnologia com
imaginação</description>
<language>pt-br</language>
<copyright>Copyright: (C)
Editora Abril SA</copyright>
O comando <channel> é obriga-
tório em arquivos RSS. Ele só será
fechado (</channel>) no final do do-
cumento, depois de todos os itens.
Os outros comandos especificam as

T pode para atrair sempre

mais visitantes para o si-
te. Um modo de conquis-
ta bom e barato é o RSS. Criado em
Há cerca de dez, e a própria sigla
RSS pode significar Really Simple
Syndication, RDF Site Summary ou
Rich Site Summary, dependendo da
“-//Netscape Communications//
DTD RSS 0.91//EN” “http://my.
netscape.com/publish/formats/
rss-0.91. dtd”>
principais características do site.

3. AS NOTÍCIAS
Na terceira parte, fornecemos os tí-
1999 pela Netscape, esse padrão fa- versão adotada. <rss version=”0.91”> tulos, links e descrições das notícias
cilita a distribuição de conteúdo e pe- O exemplo deste tutorial foi cria- publicadas. Cada
de pouco conhecimento técnico. Por do com base no padrão 0.91, o mais Na primeira SHTML também notícia fica conti-
isso, é uma boa opção para aumen- popular e simples dos formatos, tag, o parâmetro tem vez da entre os rótu-
tar a visibilidade do site sem gastar mesmo depois de lançada a versão encoding=“ISO- Se as páginas do seu site utilizam SSI los <item> e
(shtml), você não precisa
muito tempo ou dinheiro. 2.0. O arquivo está disponível para 8859-1” é usado convertê-las para PHP. Basta incluir </item>, como
Baseado em XML, o RSS é ade- download no endereço www.info. para evitar pro- o script da seguinte forma: podemos obser-
quado para websites com atualiza- abril.com.br/download/3534. blemas com cedi- <!--#include virtual= var a seguir.
“infoexame.php” -->
ções freqüentes, como serviços de shtml. Quem conhece um pouco de lha e acentos. O
notícias e classificados. O funciona- HTML entenderá facilmente a sinta- segundo comando especifica a DTD <item>
mento é simples: o webmaster cria xe. Vamos agora detalhar o docu- (Document Type Definition) usada <title>Script kiddie brasileiro é
o arquivo com os no documento. Na última linha, te- preso no Japão</title>
links das atualiza- mos a versão do RSS. <link>http://info.abril.com.br/
ções do site e o pu- aberto/infonews/112003/
blica em seu servi- 2. A IDENTIFICAÇÃO 03112003-5.shl</link>
dor. Na outra ponta, No segundo bloco, fornecemos in- <description>Um adolescente bra-
o internauta usa um formações do site, como título, URL sileiro de 17 anos foi preso no Ja-
cliente RSS, como o e descrição. Esses dados serão exi- pão, acusado de participação na in-
amphetaDesk e o bidos quando o internauta abrir o vasão de 1 032 sites. </description>
Awasu, para buscar arquivo no seu cliente RSS. </item>
as atualizações mais <item>
recentes dos canais <channel> <title>MIT fecha sistema alternati-
que configurou. <title>Plantão INFO</title> vo de peer-to-peer</title>
Muito mais difícil <link>http://info.abril.com.br/ <link>http://info.abril.com.br/
do que criar o ar- amphetaDesk: cliente de RSS simples traz notícias da INFO </link> aberto/infonews/112003/

92 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 93
TUTORIAL/ RSS 24.05.05 12:43 Page 92

TUTORIAL/RSS TUTORIAL/RSS

SITE ESPERTO
mento. Ele tem três partes básicas:
versões, identificação e notícias.
1.
LÊ OS FEEDS
AS VERSÕES
O primeiro passo é informar as ver-
sões do XML e do RSS utilizadas no
O RSS É UMA ÓTIMA FERRAMENTA PARA ATRAIR documento com as seguintes tags:
VISITANTES E TAMBÉM ATUALIZAR O SITE
POR ANDRÉ CARDOZO <?xml version=“1.0” encoding=
“ISO-8859-1” ?>
odo webmaster faz o que quivo RSS é saber qual versão usar. <!DOCTYPE rss PUBLIC
<description>Tecnologia com
imaginação</description>
<language>pt-br</language>
<copyright>Copyright: (C)
Editora Abril SA</copyright>
O comando <channel> é obriga-
tório em arquivos RSS. Ele só será
fechado (</channel>) no final do do-
cumento, depois de todos os itens.
Os outros comandos especificam as

T pode para atrair sempre

mais visitantes para o si-
te. Um modo de conquis-
ta bom e barato é o RSS. Criado em
Há cerca de dez, e a própria sigla
RSS pode significar Really Simple
Syndication, RDF Site Summary ou
Rich Site Summary, dependendo da
“-//Netscape Communications//
DTD RSS 0.91//EN” “http://my.
netscape.com/publish/formats/
rss-0.91. dtd”>
principais características do site.

3. AS NOTÍCIAS
Na terceira parte, fornecemos os tí-
1999 pela Netscape, esse padrão fa- versão adotada. <rss version=”0.91”> tulos, links e descrições das notícias
cilita a distribuição de conteúdo e pe- O exemplo deste tutorial foi cria- publicadas. Cada
de pouco conhecimento técnico. Por do com base no padrão 0.91, o mais Na primeira SHTML também notícia fica conti-
isso, é uma boa opção para aumen- popular e simples dos formatos, tag, o parâmetro tem vez da entre os rótu-
tar a visibilidade do site sem gastar mesmo depois de lançada a versão encoding=“ISO- Se as páginas do seu site utilizam SSI los <item> e
(shtml), você não precisa
muito tempo ou dinheiro. 2.0. O arquivo está disponível para 8859-1” é usado convertê-las para PHP. Basta incluir </item>, como
Baseado em XML, o RSS é ade- download no endereço www.info. para evitar pro- o script da seguinte forma: podemos obser-
quado para websites com atualiza- abril.com.br/download/3534. blemas com cedi- <!--#include virtual= var a seguir.
“infoexame.php” -->
ções freqüentes, como serviços de shtml. Quem conhece um pouco de lha e acentos. O
notícias e classificados. O funciona- HTML entenderá facilmente a sinta- segundo comando especifica a DTD <item>
mento é simples: o webmaster cria xe. Vamos agora detalhar o docu- (Document Type Definition) usada <title>Script kiddie brasileiro é
o arquivo com os no documento. Na última linha, te- preso no Japão</title>
links das atualiza- mos a versão do RSS. <link>http://info.abril.com.br/
ções do site e o pu- aberto/infonews/112003/
blica em seu servi- 2. A IDENTIFICAÇÃO 03112003-5.shl</link>
dor. Na outra ponta, No segundo bloco, fornecemos in- <description>Um adolescente bra-
o internauta usa um formações do site, como título, URL sileiro de 17 anos foi preso no Ja-
cliente RSS, como o e descrição. Esses dados serão exi- pão, acusado de participação na in-
amphetaDesk e o bidos quando o internauta abrir o vasão de 1 032 sites. </description>
Awasu, para buscar arquivo no seu cliente RSS. </item>
as atualizações mais <item>
recentes dos canais <channel> <title>MIT fecha sistema alternati-
que configurou. <title>Plantão INFO</title> vo de peer-to-peer</title>
Muito mais difícil <link>http://info.abril.com.br/ <link>http://info.abril.com.br/
do que criar o ar- amphetaDesk: cliente de RSS simples traz notícias da INFO </link> aberto/infonews/112003/

92 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 93
TUTORIAL/ RSS 23.05.05 19:27
TUTORIAL/RSS
03112003-0.shl</link>
<description>O MIT anunciou o fe-
chamento da rede criada por dois
de seus alunos para o acesso à co-
leção de CDs da universidade.
</description>
</item>
No exemplo acima, temos títu-
lo, link e descrição de dois itens.
Após terminarmos a lista de itens,
fechamos o arquivo com os seguin-
tes comandos:
</channel>
</rss>
Pronto, o RSS já pode ser publi-
cado no servidor.
4. A ATUALIZAÇÃO
Até o passo 3, os dados foram inse-
ridos manualmente para ficar mais
claro o modo como o RSS funciona.
Mas, em sites dinâmicos, podemos
DIVULGANDO O RSS
Links acertados, tags em seu
devido lugar. Seu arquivo RSS
já está no servidor. Chegou a
hora de divulgá-lo. A iniciativa
mais óbvia é criar um link para
ele na página principal do site.
Normalmente, arquivos RSS
são identificados por pequenos
botões laranja com o texto
“XML”, mas você pode usar
outro padrão. Outra
providência que dá resultado é
cadastrar seu RSS em serviços
94 < C O L E Ç Ã O I N F O
Page 94
empregar scripts para gerar o ar-
quivo. Neste exemplo, vamos ins-
talar um script no nosso site para
mostrar notícias de feeds de outros
sites, como o da INFO no exemplo.
A solução é bem simples. Prepa-
ramos um script em PHP que irá ler
um RSS que especificarmos e mon-
tar uma lista de últimas notícias den-
tro do seu site. Para montar o script,
utilizamos uma classe Feed Reader,
criada pelo português José Carlos
Valente e distribuída como softwa-
re livre. No código-fonte, corrigimos
um pequeno bug que impedia a lei-
tura de textos com mais de uma li-
nha. A versão que incluímos entre
os arquivos deste tutorial já está
corrigida. Se você quiser ver o có-
digo original, pode obtê-lo no en-
dereço www.info.abril.com.br/
download/4178.shtml. Essa clas-
se é o bastante para passar o ende-
de busca específicos, como
Syndic8 (www.syndic8.com) e
News Is Free (www.
newsisfree.com). Uma terceira
medida é incluir o comando
<link rel=“alternate”
type=“application/rss+xml”
title=“RSS”
href=“endereço_do_rss”>
no <head> de sua home page.
Com isso, o RSS é indexado
mais facilmente por
ferramentas de busca.
TUTORIAL/RSS
reço do RSS, que retornará uma va- de desejar que apareçam as notí-
riável com todas as informações cias, incluindo o seguinte código
contidas nele. PHP nas páginas do seu site da se-
Vamos instalar as notícias: guinte forma:
A. Faça o download do script no en- <?include(“infoexame.php”);?>
dereço www.info.abril.com.br/ E. Agora que o script já está fun-
download/4201.shtml e descom- cionando, você pode alterar cores
pacte o arquivo dentro do diretó- de fundo, fonte e número de notí-
rio do seu site. Nesse pacote você cias que deverão ser exibidas. O pri-
terá três arquivos importantes: meiro passo é abrir o arquivo con-
class_feedReader.inc.php, que con- fig.php. Para alterar a cor da pri-
tém a classe em PHP utilizada pa- meira linha da tabela, onde fica o
ra ler o feed; config.php, onde es- logo do feed, edite:
tão algumas configurações de fon- $design[“headbgcolor”] =
te e cor, e modelo.php, o arquivo “#002F5E”;
final de exemplo que irá chamar a Para trocar a cor de fundo da tabe-
classe e o config. la inteira edite:
É importante que todos os arqui- $design[“tablebgcolor”] =
vos fiquem no mesmo diretório. “#FFFFFF”;
B. Abra o arquivo modelo.php e edi- Para mudar a fonte que deve ser usa-
te a linha $caminhorss = “http:// da, altere a linha:
info.abril.com.br/aberto/infonews/ $design[“font”] = “Arial, Verdana,
rssnews.xml”; colocando o endere- Sans-serif”;
ço do RSS que deseja ler. Para mudar o número de notícias a
C. Salve o arquivo com um outro no- serem exibidas, mude esta linha:
me, infoexame.php, por exemplo, e $limite = 10;
coloque-o na pasta
raiz do seu site. Pa-
ra visualizar esta
parte, acesse http://
seusite.com.br/
infoexame.php. O
script irá gerar uma
tabela com as notí-
cias do site da INFO.
D. Agora, nas pági-
nas do seu site, in-
clua o script infoe-
xame.php exata-
mente no lugar on- Awasu: opções avançadas no gerenciamento de RSS
C O L E Ç Ã O I N F O > 95
TUTORIAL/ RSS 23.05.05 19:27
TUTORIAL/RSS
03112003-0.shl</link>
<description>O MIT anunciou o fe-
chamento da rede criada por dois
de seus alunos para o acesso à co-
leção de CDs da universidade.
</description>
</item>
No exemplo acima, temos títu-
lo, link e descrição de dois itens.
Após terminarmos a lista de itens,
fechamos o arquivo com os seguin-
tes comandos:
</channel>
</rss>
Pronto, o RSS já pode ser publi-
cado no servidor.
4. A ATUALIZAÇÃO
Até o passo 3, os dados foram inse-
ridos manualmente para ficar mais
claro o modo como o RSS funciona.
Mas, em sites dinâmicos, podemos
DIVULGANDO O RSS
Links acertados, tags em seu
devido lugar. Seu arquivo RSS
já está no servidor. Chegou a
hora de divulgá-lo. A iniciativa
mais óbvia é criar um link para
ele na página principal do site.
Normalmente, arquivos RSS
são identificados por pequenos
botões laranja com o texto
“XML”, mas você pode usar
outro padrão. Outra
providência que dá resultado é
cadastrar seu RSS em serviços
94 < C O L E Ç Ã O I N F O
Page 94
empregar scripts para gerar o ar-
quivo. Neste exemplo, vamos ins-
talar um script no nosso site para
mostrar notícias de feeds de outros
sites, como o da INFO no exemplo.
A solução é bem simples. Prepa-
ramos um script em PHP que irá ler
um RSS que especificarmos e mon-
tar uma lista de últimas notícias den-
tro do seu site. Para montar o script,
utilizamos uma classe Feed Reader,
criada pelo português José Carlos
Valente e distribuída como softwa-
re livre. No código-fonte, corrigimos
um pequeno bug que impedia a lei-
tura de textos com mais de uma li-
nha. A versão que incluímos entre
os arquivos deste tutorial já está
corrigida. Se você quiser ver o có-
digo original, pode obtê-lo no en-
dereço www.info.abril.com.br/
download/4178.shtml. Essa clas-
se é o bastante para passar o ende-
de busca específicos, como
Syndic8 (www.syndic8.com) e
News Is Free (www.
newsisfree.com). Uma terceira
medida é incluir o comando
<link rel=“alternate”
type=“application/rss+xml”
title=“RSS”
href=“endereço_do_rss”>
no <head> de sua home page.
Com isso, o RSS é indexado
mais facilmente por
ferramentas de busca.
TUTORIAL/RSS
reço do RSS, que retornará uma va- de desejar que apareçam as notí-
riável com todas as informações cias, incluindo o seguinte código
contidas nele. PHP nas páginas do seu site da se-
Vamos instalar as notícias: guinte forma:
A. Faça o download do script no en- <?include(“infoexame.php”);?>
dereço www.info.abril.com.br/ E. Agora que o script já está fun-
download/4201.shtml e descom- cionando, você pode alterar cores
pacte o arquivo dentro do diretó- de fundo, fonte e número de notí-
rio do seu site. Nesse pacote você cias que deverão ser exibidas. O pri-
terá três arquivos importantes: meiro passo é abrir o arquivo con-
class_feedReader.inc.php, que con- fig.php. Para alterar a cor da pri-
tém a classe em PHP utilizada pa- meira linha da tabela, onde fica o
ra ler o feed; config.php, onde es- logo do feed, edite:
tão algumas configurações de fon- $design[“headbgcolor”] =
te e cor, e modelo.php, o arquivo “#002F5E”;
final de exemplo que irá chamar a Para trocar a cor de fundo da tabe-
classe e o config. la inteira edite:
É importante que todos os arqui- $design[“tablebgcolor”] =
vos fiquem no mesmo diretório. “#FFFFFF”;
B. Abra o arquivo modelo.php e edi- Para mudar a fonte que deve ser usa-
te a linha $caminhorss = “http:// da, altere a linha:
info.abril.com.br/aberto/infonews/ $design[“font”] = “Arial, Verdana,
rssnews.xml”; colocando o endere- Sans-serif”;
ço do RSS que deseja ler. Para mudar o número de notícias a
C. Salve o arquivo com um outro no- serem exibidas, mude esta linha:
me, infoexame.php, por exemplo, e $limite = 10;
coloque-o na pasta
raiz do seu site. Pa-
ra visualizar esta
parte, acesse http://
seusite.com.br/
infoexame.php. O
script irá gerar uma
tabela com as notí-
cias do site da INFO.
D. Agora, nas pági-
nas do seu site, in-
clua o script infoe-
xame.php exata-
mente no lugar on- Awasu: opções avançadas no gerenciamento de RSS
C O L E Ç Ã O I N F O > 95
TUTORIAL/RSS/PDA1 23.05.05 18:56
TUTORIAL/RSS/PDA
NOTÍCIAS
NO PALMTOP
UM PASSO-A-PASSO PARA PRODUZIR UMA VERSÃO
PARA HANDHELD DE UM SITE COM NOTICIÁRIO
POR MAURÍCIO GREGO
crescente número de
O PDAs e smartphones
com conexão à internet
torna quase obrigatório
que os websites ofereçam páginas
específicas para esses dispositivos.
Com telas pequenas e navegadores
que, em boa parte, não suportam CSS,
DHTML, JavaScript ou Flash, esses
equipamentos requerem páginas sim-
plificadas para uma boa visualização.
Na maioria das vezes, o que se dese-
ja é aproveitar o conteúdo existente
no site e formatá-lo, criando uma ver-
são para telas pequenas. É o que va-
mos fazer neste tutorial.
Há várias soluções possíveis para
isso. Neste exemplo, vamos partir
de um site de notícias e gerar uma
versão para handheld desse conteú-
do. Para isso, vamos aproveitar o
fluxo de notícias produzido em for-
mato RSS no tutorial da página 92.
Depois, vamos empregar uma clas-
se em PHP para extrair as notícias
do RSS. Essa classe será usada por
um script, também em PHP, para
montar as páginas HTML simplifica-
das. Para acompanhar o tutorial, fa-
ça o download dos arquivos neces-
96 < C O L E Ç Ã O I N F O
Page 96
sários no endereço www.info.abril.
com.br/download/4180.shtml. Pa-
ra ver o site que montamos como
exemplo, faça o upload desses ar-
quivos para um servidor da web com
PHP 4 ou mais recente instalado.
1. A ESTRUTURA
Nosso site para handheld tem uma
página inicial, handheld.html, produ-
zida em HTML puro. É uma página
simples onde todos os elementos es-
tão contidos numa tabela com 300
pixels de largura. Esse é um tama-
nho adequado para visualização na
Lista de notícias: em HTML estático
maioria dos handhelds atuais. Essa
página contém os links para quatro
seções de notícias que, em nosso
exemplo chamamos de TI, E-business,
Tecnologia Pessoal e Internet, res-
pectivamente. Cada um desses qua-
tro links leva a um arquivo PHP que
vai gerar o índice de notícias corres-
pondente àquela seção. Vamos usar
um arquivo RSS diferente para cada
seção. Como o procedimento é o mes-
mo nas quatro, vamos descrever, nos
próximos passos, a construção de
uma das seções. Basta replicar os ar-
quivos PHP, alterando título e origem
do RSS em cada um deles, para ob-
ter as outras três seções.
2. O ARQUIVO
A maneira de produzir o RSS varia
conforme o caso. Quem possui um si-
te dinâmico pode empregar scripts
para gerá-lo. Além disso, muitos ge-
renciadores de conteúdo incluem a
opção de saída em RSS. No nosso
exemplo, vamos repetir os procedi-
mentos do tutorial da página 92 pa-
ra montar a estrutura de um arquivo
RSS básico. Nos próximos passos, va-
mos ver como extrair as notícias de-
le e montar a versão para handhelds.
3. AS CONFIGURAÇÕES
Para extrair as notícias, usamos uma
classe Feed Reader. E para que a
classe funcione, é preciso criar o ar-
quivo config.php. Ele deve ficar no
mesmo diretório do servidor HTTP
onde estão os arquivos class_feed-
Reader.inc.php e handheld.php.
TUTORIAL/RSS/PDA
Texto da notícia: gerado por um script
No arquivo config.php, coloque
o endereço do seu arquivo RSS. Po-
de ser um caminho local (exemplo:
/home/site/www/rss.xml) ou um
endereço na internet (exemplo:
http://www.site.com.br/rss.xml).
No nosso exemplo, vamos apontar
para um arquivo na mesma pasta:
$caminhorss[] = “rss_ti.xml”;
Nosso script possibilita agregar
notícias de vários arquivos RSS nu-
ma mesma página para handheld.
Para isso, basta repetir a linha aci-
ma para cada RSS, especificando o
nome do arquivo correspondente.
Depois de definir a localização do
RSS, acerte as cores de fundo, o tí-
tulo da página e a fonte de carac-
teres acrescentando esses coman-
dos ao arquivo config.php:
$design[“title”] = “Notícias de TI”;
$design[“logo”] = “greatfun.gif”;
$design[“bodybgcolor”] =
C O L E Ç Ã O I N F O > 97
TUTORIAL/RSS/PDA1 23.05.05 18:56
TUTORIAL/RSS/PDA
NOTÍCIAS
NO PALMTOP
UM PASSO-A-PASSO PARA PRODUZIR UMA VERSÃO
PARA HANDHELD DE UM SITE COM NOTICIÁRIO
POR MAURÍCIO GREGO
crescente número de
O PDAs e smartphones
com conexão à internet
torna quase obrigatório
que os websites ofereçam páginas
específicas para esses dispositivos.
Com telas pequenas e navegadores
que, em boa parte, não suportam CSS,
DHTML, JavaScript ou Flash, esses
equipamentos requerem páginas sim-
plificadas para uma boa visualização.
Na maioria das vezes, o que se dese-
ja é aproveitar o conteúdo existente
no site e formatá-lo, criando uma ver-
são para telas pequenas. É o que va-
mos fazer neste tutorial.
Há várias soluções possíveis para
isso. Neste exemplo, vamos partir
de um site de notícias e gerar uma
versão para handheld desse conteú-
do. Para isso, vamos aproveitar o
fluxo de notícias produzido em for-
mato RSS no tutorial da página 92.
Depois, vamos empregar uma clas-
se em PHP para extrair as notícias
do RSS. Essa classe será usada por
um script, também em PHP, para
montar as páginas HTML simplifica-
das. Para acompanhar o tutorial, fa-
ça o download dos arquivos neces-
96 < C O L E Ç Ã O I N F O
Page 96
sários no endereço www.info.abril.
com.br/download/4180.shtml. Pa-
ra ver o site que montamos como
exemplo, faça o upload desses ar-
quivos para um servidor da web com
PHP 4 ou mais recente instalado.
1. A ESTRUTURA
Nosso site para handheld tem uma
página inicial, handheld.html, produ-
zida em HTML puro. É uma página
simples onde todos os elementos es-
tão contidos numa tabela com 300
pixels de largura. Esse é um tama-
nho adequado para visualização na
Lista de notícias: em HTML estático
maioria dos handhelds atuais. Essa
página contém os links para quatro
seções de notícias que, em nosso
exemplo chamamos de TI, E-business,
Tecnologia Pessoal e Internet, res-
pectivamente. Cada um desses qua-
tro links leva a um arquivo PHP que
vai gerar o índice de notícias corres-
pondente àquela seção. Vamos usar
um arquivo RSS diferente para cada
seção. Como o procedimento é o mes-
mo nas quatro, vamos descrever, nos
próximos passos, a construção de
uma das seções. Basta replicar os ar-
quivos PHP, alterando título e origem
do RSS em cada um deles, para ob-
ter as outras três seções.
2. O ARQUIVO
A maneira de produzir o RSS varia
conforme o caso. Quem possui um si-
te dinâmico pode empregar scripts
para gerá-lo. Além disso, muitos ge-
renciadores de conteúdo incluem a
opção de saída em RSS. No nosso
exemplo, vamos repetir os procedi-
mentos do tutorial da página 92 pa-
ra montar a estrutura de um arquivo
RSS básico. Nos próximos passos, va-
mos ver como extrair as notícias de-
le e montar a versão para handhelds.
3. AS CONFIGURAÇÕES
Para extrair as notícias, usamos uma
classe Feed Reader. E para que a
classe funcione, é preciso criar o ar-
quivo config.php. Ele deve ficar no
mesmo diretório do servidor HTTP
onde estão os arquivos class_feed-
Reader.inc.php e handheld.php.
TUTORIAL/RSS/PDA
Texto da notícia: gerado por um script
No arquivo config.php, coloque
o endereço do seu arquivo RSS. Po-
de ser um caminho local (exemplo:
/home/site/www/rss.xml) ou um
endereço na internet (exemplo:
http://www.site.com.br/rss.xml).
No nosso exemplo, vamos apontar
para um arquivo na mesma pasta:
$caminhorss[] = “rss_ti.xml”;
Nosso script possibilita agregar
notícias de vários arquivos RSS nu-
ma mesma página para handheld.
Para isso, basta repetir a linha aci-
ma para cada RSS, especificando o
nome do arquivo correspondente.
Depois de definir a localização do
RSS, acerte as cores de fundo, o tí-
tulo da página e a fonte de carac-
teres acrescentando esses coman-
dos ao arquivo config.php:
$design[“title”] = “Notícias de TI”;
$design[“logo”] = “greatfun.gif”;
$design[“bodybgcolor”] =
C O L E Ç Ã O I N F O > 97
TUTORIAL/RSS/PDA1 23.05.05 18:56
TUTORIAL/RSS/PDA
“#493F2C”;
$design[“headbgcolor”] =
“#BFB495”;
$design[“tablebgcolor”] =
“#FFFFFF”;
$design[“font”] = “Arial, Verdana,
Sans-serif”;
4. O SCRIPT
O arquivo handheld.php contém o
script que monta a página HTML pa-
ra visualização no handheld. Ele ser-
ve tanto para gerar o índice de uma
seção de notícias como para produ-
zir a página com o texto completo da
notícia. Nos dois casos, a página é
formada por uma tabela com uma
coluna de 300 pixels de largura. A
primeira linha da tabela contém o
gráfico do alto da página. As notícias
são inseridas, da segunda linha em
diante, por meio de comandos em
PHP. Vejamos como eles funcionam:
if(!isset($_REQUEST[“feed”]) &&
!isset($_REQUEST[“item”]))
Esse comando testa se foi espe-
cificada alguma notícia junto com a
URL que ativa o script. Se foi, ele
monta a página com a notícia. Se-
não, gera o índice do noticiário.
5. O ÍNDICE
Vejamos os comandos usados para
a produção de um índice de notícias:
foreach($caminhorss as $url)
Essa instrução especifica que o pro-
cesso de inclusão das notícias deve
ser repetido para cada arquivo RSS
a ser usado nessa seção, caso haja
mais de um. Em seguida, temos:
98 < C O L E Ç Ã O I N F O
Page 98
$ob=new feedReader();
$ob->setFeedUrl($url);
$ob->parseFeed();
$array=$ob->getFeedOutputData();
$number=$ob->
getFeedNumber OfNodes();
Na primeira linha acima, carrega-
mos a classe feedReader no objeto
$ob. Nas duas linhas seguintes, ati-
vamos funções internas dessa clas-
se para localizar o RSS e extrair as
notícias. Os textos extraídos são car-
regados na variável $array, e o nú-
mero de notícias, em $number.
Na seqüência, temos o comando
echo, que gera o código HTML cor-
respondente a uma das notícias. No-
te que ele está dentro de um loop
que faz com que seja repetido para
cada uma das notícias no RSS.
for($i=0;$i<$number;$i++){
echo (“<tr><td><font face=
\““.$design [“font”].”\”size=\“2\”>
&#149; <a href=\“handheld.php?
feed= “.$f. ”&item=“.$i.”\”>“.
$array[“ item”][“title”][$i]. ”
</a></font></td></tr>”);
}
Observe que o título de cada notí-
cia é um link. Quando alguém clica
nele, a URL solicitada tem esta forma:
http://www.site.com.br/
handheld.php?feed=0&item=3
A contagem dos parâmetros feed
e item começa em zero. Assim, a URL
do exemplo acima vai abrir, no na-
vegador, a quarta notícia do primei-
ro arquivo RSS. A notícia seleciona-
da será exibida com a ajuda do mes-
mo script usado para gerar o índice.
TUTORIAL/AVALIAÇÃO 23.05.05 17:31 Page 99
QUE NOTA O
SITE MERECE?
CRIE SCRIPTS EM PHP E JAVASCRIPT PARA O INTERNAUTA
FAZER SUA AVALIAÇÃO
POR CARLOS MACHADO, COM FRED CARBONARE
rodutos, serviços, dicas,
P atendimento online, tu-
do o que o site oferece
pode ser avaliado pelo
internauta por meio de notas. Além
de ser uma atitude simpática, não
toma tempo do visitante e ajuda o
dono do site a identificar o que es-
tá dando certo e o que tem proble-
mas. INFO desenvolveu um script
chamado Nota para fazer esse tipo
de avaliação. Para usá-lo, você pre-
cisa ter acesso a um servidor web,
em qualquer plataforma — Linux,
Windows, outros Unix etc. —, no
qual esteja instalada a linguagem
PHP, pelo menos na versão 3.
Avaliação: o produto recebe nota via menu suspenso
TUTORIAL/AVALIAÇÃO
1. O FUNCIONAMENTO
Na página que contém o item a ser
avaliado, o internauta encontra um
quadro com uma chamada como
“Qual nota você dá a X ou Y?” Nesse
quadro também estão uma caixa de
combinação com as notas de 0 a 10
e um botão de comando para enviar
a avaliação. Quando ele clica no bo-
tão, o script no servidor entra em ação
e mostra uma página pop-up com a
nova média de avaliação dos inter-
nautas, já computada a nota atribuí-
da por esse último visitante.
2. O SERVIDOR
Para usar o script Nota, você precisa
executar duas tarefas. A
primeira consiste em ins-
talar o código PHP no
servidor. A outra é colo-
car na página do item a
ser avaliado uma cha-
mada para o script. A ins-
talação do código é sim-
ples. Faça o download
dos arquivos no site de
INFO (www.info.abril.
com.br/download/
3646.shtml). Extraia os
C O L E Ç Ã O I N F O > 99
TUTORIAL/AVALIAÇÃO 23.05.05 17:30
TUTORIAL/AVALIAÇÃO
arquivos PHP e copie-os para o ser-
vidor. São quatro: grava.php, que re-
gistra as avaliações num arquivo-texto
para cada item; resultado.php, que lê
os dados acumulados do item em
questão e exibe a média atual. Há ain-
da o arquivo configs.inc.php, respon-
sável pela configuração dos diretó-
rios de trabalho; e adminnota.php,
que oferece ao administrador uma in-
terface para incluir novos itens a ava-
liar, além de exibir os resultados de
todos os itens. Só é preciso configu-
rar o arquivo configs.inc.php. Abra-o
e edite as linhas que definem as va-
riáveis $path, o caminho do diretório
onde estão os scripts; $data_path, pas-
ta onde serão gravados os arquivos
com notas de cada item; e $url_path,
a pasta onde vão ficar os scripts PHP.
3. A PÁGINA WEB
Se você vai incluir o quadro de ava-
liação numa página PHP, basta incluir
no código a linha: <?include(“http://
urldominio/rating/resultado.php?
item[ITEM]”);?> Aqui, o valor [ITEM]
deve ser trocado por um número di-
ferente para cada item avaliado. Es-
se número será o nome do arquivo
que armazena informações sobre o
item. Exemplo: 12.dat.php. Se sua pá-
gina é HTML, use um JavaScript pa-
ra disparar a execução do script PHP:
<script src=“/rating/resultado.php?
item=[ITEM]&tipo=js”></script>
A exibição dos resultados anterio-
res é feita mediante o script:
<script>MediaNota();</script>
Tanto na página PHP como na
100 < C O L E Ç Ã O I N F O
Page 100
HTML, você vai precisar de um for-
mulário com a caixa de combinação
(notas de 0 a 10) e o botão de coman-
do para o visitante confirmar a ava-
liação. Na página PHP, esse formulá-
rio é provido automaticamente pelo
comando ?include. No caso de página
padrão HTML, é preciso criar o for-
mulário com o nome rating e uma
caixa de combinação chamada nota.
Isso é feito com o script:
<script>ComboVota();</script>
O clique no botão de comando do
formulário dispara o script vota, in-
cluído na página, que captura a no-
ta indicada pelo internauta e o envia
ao script grava.php, no servidor. O
pacote de arquivos para download
no site de INFO inclui um exemplo
de página HTML com os scripts. Ca-
so você queira fazer um template di-
ferente ou mostrar os resultados de
outra forma, mande o JavaScript im-
primir as variáveis rating[‘nota’] e
rating[‘total_votos’], como no exem-
plo <script>document.write(rating
[‘nota’]);</script> ou neste outro:
<script>document.write(rating
[‘total_votos”]);</script>
Se você vai propor a avaliação pa-
ra poucos itens — digamos, na faixa
das dezenas —, esta solução funcio-
na a contento. Para grandes quanti-
dades, é aconselhável armazenar os
resultados num banco de dados. Nes-
se caso, o valor [ITEM] poderá ser o
índice do registro na tabela de da-
dos. O formato do quadro com a pro-
posta de avaliação (fonte, borda, co-
res etc.) fica a seu critério.
TUTORIAL/ NAVEGAÇÃO 23.05.05 17:36 Page 101

TUTORIAL/NAVEGAÇÃO

OS MENUS SE
DESDOBRAM
VEJA COMO FAZER BARRAS DE NAVEGAÇÃO INTERATIVAS
EM PÁGINAS COM POUCO ESPAÇO
POR ANDRÉ CARDOZO

m sites com várias sub- reservando espaço para o menu.

E divisões, o designer
muitas vezes tem difi-
culdade em dividir o
conteúdo sem ocupar todo o espa-
O exemplo deste tutorial foi ela-
borado prevendo um menu na ver-
tical, posicionado do lado esquer-
do da tela. Criamos uma célula de
ço da tela. Uma saída para fugir des- 120 pixels de largura para acomo-
se aperto é criar menus dinâmicos, dá-lo. O menu também pode ser
que se desdobram ao passar do inserido horizontalmente, no alto
mouse. É possível elaborá-los usan- da tela, por meio do atalho Menu/
do editores HTML de interface vi- Style do Selteco.
sual. Ou até mesmo “a mão”, se o
usuário tiver conhecimento de Ja- 2. AS CATEGORIAS
vaScript. Mas uma alternativa mais Antes de lidar com o Selteco Me-
fácil é usar um dos diversos progra- nu Maker, precisamos saber exa-
mas especializados nessa função. tamente quais são as categorias e
Neste tutorial, utilizamos o Selteco subcategorias do menu para evi-
Menu Maker 4.0. A
versão de testes fun-
ciona por dez dias, o
registro custa 29 dó-
lares, e o download
pode ser feito em
www.info.abril.com.
br/download/3430.
shtml.

1. A PÁGINA HTML
Para começar, pre-
cisamos criar uma
página em HTML, já Selteco Menu Maker: formatando as cores do menu

C O L E Ç Ã O I N F O > 101
TUTORIAL/ NAVEGAÇÃO 23.05.05 17:36
TUTORIAL/NAVEGAÇÃO
Mais itens: cada um deve ter nome e link para o HTML
tar correções mais a frente. No
exemplo criado por INFO, temos
as seguintes categorias e subcate-
gorias: monitores (15 e 17 polega-
das), memórias (SDRAM e DDR),
placas de vídeo (AGP 4X e 8X) e
placas de som (16 bits e 24 bits).
3. A INTERFACE
Abrimos o Selteco Menu Maker pa-
ra começar a desenvolver nosso
menu. Do lado esquerdo da tela, o
usuário cria e apaga categorias e
subcategorias, inserindo nome e
link para cada uma. O lado direito
mostra em tempo real todas as mo-
dificações realizadas. A janela Me-
nu Properties controla as proprie-
dades visuais do menu e será vis-
ta em detalhes adiante.
4. OS ITENS
Ao selecionar um novo projeto, o
Selteco mostra alguns itens já con-
figurados. Dê um duplo clique ne-
les e modifique suas propriedades
102 < C O L E Ç Ã O I N F O
Page 102
para inserir os itens
do menu. Cada item
deve ter nome e um
link para o arquivo
HTML desejado. Não
tem importância se
as páginas não esti-
verem prontas —
precisamos apenas
do nome do arqui-
vo. Para criar mais
categorias, basta
acessar o menu
Edit/Add Item. Para
adicionar uma subcategoria, mar-
que a categoria à qual ela perten-
ce e use o mesmo comando.
5. O VISUAL
Agora o menu contém todas as ca-
tegorias e subcategorias previstas.
Mas o visual ainda deixa a desejar.
Para adaptá-lo ao layout de nosso
HTML inicial, usamos a janela Me-
nu Properties, acessada por meio
do menu View/Menu Properties. Es-
sa janela reúne num só lugar todas
as configurações visuais do menu,
que podem ser editadas clicando
nos respectivos botões.
6. O FUNDO E A FONTE
Para alterar as cores de fundo,
basta clicar no botão Background,
dentro da área Menu Bar. A tela
seguinte permite escolher a cor
visualmente ou inserir valores do
padrão de cor RGB ou o código
hexadecimal usado no HTML. Pa-
ra garantir a integração perfeita
com o arquivo HTML, escolhemos
o código hexadecimal da cor usa-
da na página (neste exemplo, é
CCCCCC, um tom de cinza). Dessa
forma, mudamos a cor de fundo
das categorias e subcategorias. Pa-
ra alterar a tonalidade acionada
quando o mouse está sobre um
item do menu (efeito mouseover),
usamos o botão Highlight e repe-
timos todo o processo.
Assim como fizemos com a cor
de fundo, alteramos as proprieda-
des da fonte usada nos menus pa-
ra adequá-la à página HTML. Para
isso, clicamos nos botões Face e
Color, na área Menu Font.
7. A GRAVAÇÃO
Nosso menu agora já tem todas as
categorias, subcategorias e está
adequado ao visual da página. Sal-
vamos o arquivo na forma de pro-
jeto do Selteco. Assim, se houver
alguma modificação no futuro, não
haverá a necessidade de debulhar
Exportação: menu pode ir num arquivo HTML ou JavaScript regar o JavaScript.
TUTORIAL/NAVEGAÇÃO
o código JavaScript. Basta abrir no-
vamente o projeto e fazer as cor-
reções visualmente.
8. A EXPORTAÇÃO DO MENU
O Selteco Menu Maker pode expor-
tar o menu de duas formas: inse-
rido num arquivo HTML ou como
um arquivo JavaScript indepen-
dente (com a extensão .js). A se-
gunda opção tem a vantagem de
valer para todas as páginas do si-
te e só ser carregada uma vez pe-
lo browser, proporcionando maior
rapidez na navegação. Escolhemos
a opção Export JavaScript e salva-
mos o arquivo .js no mesmo dire-
tório da página HTML para evitar
problemas de caminho.
9. A CHAMADA
Agora, falta apenas “chamar” o
arquivo JavaScript para a nossa
página original. Para isso, abri-
mos o código-fonte do arquivo
HTML e inserimos a tag: <script src=
“nomedoarquivo.
js”></script> den-
tro da célula que
criamos no lado
esquerdo da tela.
Pronto, o menu
desdobrável já está
funcionando direi-
tinho dentro da
nossa página. Ago-
ra, toda vez que um
internauta acessar
a página, irá car-
C O L E Ç Ã O I N F O > 103
TUTORIAL/ NAVEGAÇÃO 23.05.05 17:36
TUTORIAL/NAVEGAÇÃO
Mais itens: cada um deve ter nome e link para o HTML
tar correções mais a frente. No
exemplo criado por INFO, temos
as seguintes categorias e subcate-
gorias: monitores (15 e 17 polega-
das), memórias (SDRAM e DDR),
placas de vídeo (AGP 4X e 8X) e
placas de som (16 bits e 24 bits).
3. A INTERFACE
Abrimos o Selteco Menu Maker pa-
ra começar a desenvolver nosso
menu. Do lado esquerdo da tela, o
usuário cria e apaga categorias e
subcategorias, inserindo nome e
link para cada uma. O lado direito
mostra em tempo real todas as mo-
dificações realizadas. A janela Me-
nu Properties controla as proprie-
dades visuais do menu e será vis-
ta em detalhes adiante.
4. OS ITENS
Ao selecionar um novo projeto, o
Selteco mostra alguns itens já con-
figurados. Dê um duplo clique ne-
les e modifique suas propriedades
102 < C O L E Ç Ã O I N F O
Page 102
para inserir os itens
do menu. Cada item
deve ter nome e um
link para o arquivo
HTML desejado. Não
tem importância se
as páginas não esti-
verem prontas —
precisamos apenas
do nome do arqui-
vo. Para criar mais
categorias, basta
acessar o menu
Edit/Add Item. Para
adicionar uma subcategoria, mar-
que a categoria à qual ela perten-
ce e use o mesmo comando.
5. O VISUAL
Agora o menu contém todas as ca-
tegorias e subcategorias previstas.
Mas o visual ainda deixa a desejar.
Para adaptá-lo ao layout de nosso
HTML inicial, usamos a janela Me-
nu Properties, acessada por meio
do menu View/Menu Properties. Es-
sa janela reúne num só lugar todas
as configurações visuais do menu,
que podem ser editadas clicando
nos respectivos botões.
6. O FUNDO E A FONTE
Para alterar as cores de fundo,
basta clicar no botão Background,
dentro da área Menu Bar. A tela
seguinte permite escolher a cor
visualmente ou inserir valores do
padrão de cor RGB ou o código
hexadecimal usado no HTML. Pa-
ra garantir a integração perfeita
com o arquivo HTML, escolhemos
o código hexadecimal da cor usa-
da na página (neste exemplo, é
CCCCCC, um tom de cinza). Dessa
forma, mudamos a cor de fundo
das categorias e subcategorias. Pa-
ra alterar a tonalidade acionada
quando o mouse está sobre um
item do menu (efeito mouseover),
usamos o botão Highlight e repe-
timos todo o processo.
Assim como fizemos com a cor
de fundo, alteramos as proprieda-
des da fonte usada nos menus pa-
ra adequá-la à página HTML. Para
isso, clicamos nos botões Face e
Color, na área Menu Font.
7. A GRAVAÇÃO
Nosso menu agora já tem todas as
categorias, subcategorias e está
adequado ao visual da página. Sal-
vamos o arquivo na forma de pro-
jeto do Selteco. Assim, se houver
alguma modificação no futuro, não
haverá a necessidade de debulhar
Exportação: menu pode ir num arquivo HTML ou JavaScript regar o JavaScript.
TUTORIAL/NAVEGAÇÃO
o código JavaScript. Basta abrir no-
vamente o projeto e fazer as cor-
reções visualmente.
8. A EXPORTAÇÃO DO MENU
O Selteco Menu Maker pode expor-
tar o menu de duas formas: inse-
rido num arquivo HTML ou como
um arquivo JavaScript indepen-
dente (com a extensão .js). A se-
gunda opção tem a vantagem de
valer para todas as páginas do si-
te e só ser carregada uma vez pe-
lo browser, proporcionando maior
rapidez na navegação. Escolhemos
a opção Export JavaScript e salva-
mos o arquivo .js no mesmo dire-
tório da página HTML para evitar
problemas de caminho.
9. A CHAMADA
Agora, falta apenas “chamar” o
arquivo JavaScript para a nossa
página original. Para isso, abri-
mos o código-fonte do arquivo
HTML e inserimos a tag: <script src=
“nomedoarquivo.
js”></script> den-
tro da célula que
criamos no lado
esquerdo da tela.
Pronto, o menu
desdobrável já está
funcionando direi-
tinho dentro da
nossa página. Ago-
ra, toda vez que um
internauta acessar
a página, irá car-
C O L E Ç Ã O I N F O > 103
TUTORIAL/ FORMULÁRIO 23.05.05 21:19 Page 104

TUTORIAL/FORMULÁRIO TUTORIAL/FORMULÁRIO

BOLETIM? É COM
barra de formulá-
rio e clicamos no
botão Form. Digi-

O DREAMWEAVER
tamos a palavra
“Nome” e, ao la-
do dela, clicamos
SAIBA COMO MONTAR UM FORMULÁRIO PARA PEDIDO DE no botão Text
NEWSLETTER COM MYSQL E PHP Field para inserir
POR ANDRÉ CARDOZO a primeira caixa
de texto para o
s newsletters são um Neste tutorial, vamos montar no primeiro campo.

A dos bons serviços pres-

tados pelos sites de no-
tícias. Nada melhor, pa-
ra o usuário, do que abrir a caixa
site um pedido de recebimento de
boletim de notícias no Dreamwea-
ver. O formulário acessará um ban-
co de dados MySQL por meio de
Campos e botão: ajuste de propriedades completa o modelo

novo registro. Os campos “nome”

de correio eletrônico e encontrar um script em PHP. Para testar o
informações fresquinhas sobre o formulário localmente, é necessá-
assunto que lhe interessa. Para a rio ter o PHP, o MySQL e um ser-
empresa que envia, a visibilidade vidor web instalados no sistema.
é garantida, e a fidelidade, culti- O banco de dados MySQL pode ser
vada. Desenvolvedores de softwa- criado por meio de comandos ou de
re, por exemplo, se beneficiam do interfaces gráficas. Aqui, vamos usar
envio de boletins sobre as atuali- o programa SQLyog (disponível no
zações e correções de bugs de seus endereço www.info.abril.com.br/
programas. Mas sempre para os download/3232.shtml) para criar o
usuários cadastrados, é claro. banco de dados.
1. AS TABELAS
O importante no
banco de dados
do nosso boletim
é que a tabela te-
nha quatro cam-
pos: id, nome,
email e boletim.
O campo “id” é a
chave primária do
banco de dados e
aumenta seu va-
Formulário: pedido de entrega de boletim por e-mail lor em um a cada
e “email” recebem os dados de no-
me e e-mail do internauta. O cam-
po “boletim” aceita apenas valo-
res 0 e 1, que correspondem a acei-
tar ou não o boletim de notícias.
2. O SITE
Com o banco de dados montado,
vamos definir um site no Dream-
weaver. Acionamos o menu Site >
Manage Sites e, depois, clicamos
no botão New. Na aba Advanced,
acessamos a categoria Testing Ser-
ver e escolhemos a opção PHP
MySQL e o tipo de acesso. Para fi-
nalizar, clicamos em OK. Acessa-
mos o menu File > New para criar
um arquivo novo. Escolhemos o ti-
po PHP e clicamos em OK. Depois,
usamos as ferramentas do Dream-
weaver para fazer o layout.
3. O FORMULÁRIO
Com o layout montado, é hora de
inserir o formulário. Exibimos a
Depois, ajusta-
mos as proprie-
dades da caixa.
Repetimos o procedimento pa-
ra o campo de e-mail. Digitamos a
palavra, inserimos a caixa e confi-
guramos suas propriedades.
4. O PEDIDO
O próximo campo é a caixa em que
o internauta indica se quer ou não
receber o boletim de notícias. Di-
gitamos a frase e clicamos na cai-
xa Checkbox para inserir a caixa
de seleção. Damos o nome de “bo-
letim” para a caixa.
O último componente do formu-
lário é o botão que envia as infor-
mações. Clicamos no ícone Button
da barra de ferramentas e ajusta-
mos as propriedades do botão pa-
ra completar o formulário. A par-
te visual está pronta.
5. A CONEXÃO
Para criar a conexão com o banco
de dados, acessamos o menu Win-
dow > Databases. Clicamos no si-
nal de mais do painel e escolhe-

104 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 105

TUTORIAL/ FORMULÁRIO 23.05.05 21:19 Page 104

TUTORIAL/FORMULÁRIO TUTORIAL/FORMULÁRIO

BOLETIM? É COM
barra de formulá-
rio e clicamos no
botão Form. Digi-

O DREAMWEAVER
tamos a palavra
“Nome” e, ao la-
do dela, clicamos
SAIBA COMO MONTAR UM FORMULÁRIO PARA PEDIDO DE no botão Text
NEWSLETTER COM MYSQL E PHP Field para inserir
POR ANDRÉ CARDOZO a primeira caixa
de texto para o
s newsletters são um Neste tutorial, vamos montar no primeiro campo.

A dos bons serviços pres-

tados pelos sites de no-
tícias. Nada melhor, pa-
ra o usuário, do que abrir a caixa
site um pedido de recebimento de
boletim de notícias no Dreamwea-
ver. O formulário acessará um ban-
co de dados MySQL por meio de
Campos e botão: ajuste de propriedades completa o modelo

novo registro. Os campos “nome”

de correio eletrônico e encontrar um script em PHP. Para testar o
informações fresquinhas sobre o formulário localmente, é necessá-
assunto que lhe interessa. Para a rio ter o PHP, o MySQL e um ser-
empresa que envia, a visibilidade vidor web instalados no sistema.
é garantida, e a fidelidade, culti- O banco de dados MySQL pode ser
vada. Desenvolvedores de softwa- criado por meio de comandos ou de
re, por exemplo, se beneficiam do interfaces gráficas. Aqui, vamos usar
envio de boletins sobre as atuali- o programa SQLyog (disponível no
zações e correções de bugs de seus endereço www.info.abril.com.br/
programas. Mas sempre para os download/3232.shtml) para criar o
usuários cadastrados, é claro. banco de dados.
1. AS TABELAS
O importante no
banco de dados
do nosso boletim
é que a tabela te-
nha quatro cam-
pos: id, nome,
email e boletim.
O campo “id” é a
chave primária do
banco de dados e
aumenta seu va-
Formulário: pedido de entrega de boletim por e-mail lor em um a cada
e “email” recebem os dados de no-
me e e-mail do internauta. O cam-
po “boletim” aceita apenas valo-
res 0 e 1, que correspondem a acei-
tar ou não o boletim de notícias.
2. O SITE
Com o banco de dados montado,
vamos definir um site no Dream-
weaver. Acionamos o menu Site >
Manage Sites e, depois, clicamos
no botão New. Na aba Advanced,
acessamos a categoria Testing Ser-
ver e escolhemos a opção PHP
MySQL e o tipo de acesso. Para fi-
nalizar, clicamos em OK. Acessa-
mos o menu File > New para criar
um arquivo novo. Escolhemos o ti-
po PHP e clicamos em OK. Depois,
usamos as ferramentas do Dream-
weaver para fazer o layout.
3. O FORMULÁRIO
Com o layout montado, é hora de
inserir o formulário. Exibimos a
Depois, ajusta-
mos as proprie-
dades da caixa.
Repetimos o procedimento pa-
ra o campo de e-mail. Digitamos a
palavra, inserimos a caixa e confi-
guramos suas propriedades.
4. O PEDIDO
O próximo campo é a caixa em que
o internauta indica se quer ou não
receber o boletim de notícias. Di-
gitamos a frase e clicamos na cai-
xa Checkbox para inserir a caixa
de seleção. Damos o nome de “bo-
letim” para a caixa.
O último componente do formu-
lário é o botão que envia as infor-
mações. Clicamos no ícone Button
da barra de ferramentas e ajusta-
mos as propriedades do botão pa-
ra completar o formulário. A par-
te visual está pronta.
5. A CONEXÃO
Para criar a conexão com o banco
de dados, acessamos o menu Win-
dow > Databases. Clicamos no si-
nal de mais do painel e escolhe-

104 < C O L E Ç Ã O I N F O C O L E Ç Ã O I N F O > 105

TUTORIAL/ FORMULÁRIO 23.05.05 21:17 Page 106

TUTORIAL/FORMULÁRIO

mos MySQL Connection. Surge a de dados. Por isso, clicamos no si-

janela de configuração da cone- nal de mais do painel e escolhe-
xão. Nessa tela digitamos o nome mos a opção Insert Record. Na te-
da conexão, o endereço do servi- la de configuração, novamente es-
dor, o nome de colhemos a co-
usuário e, se ne- nexão com o
cessário, a senha.
Quando clicamos
FAÇA banco de dados.
O Dreamweaver
no botão de se-
FÁCil exibe a corres-
leção de banco Para simplificar a criação de pondência entre
tabelas no banco de dados,
de dados, o verifique se o serviço de os campos do
Dreamweaver hospedagem que você utiliza formulário e os
exibe todos os oferece um gerenciador do banco de da-
bancos presentes dos. No último
no sistema. Basta selecionar o de- campo, inserimos a página que se-
sejado e clicar em OK. rá exibida depois que o usuário
ativar o formulário. Quando clica-
6. A CONFIGURAÇÃO mos em OK, a ação Insert Record
A conexão criada com o banco de é exibida logo abaixo do Record-
dados é exibida no painel Databa- set. O formulário está pronto. Acio-
ses. Clicamos então no painel Ser- namos F12 para abrir o navega-
ver Behaviors. Nele, acionamos o dor e testar. Para ter certeza de
sinal de mais e escolhemos a op- que tudo deu certo, basta abrir o
ção Recordset. Em seguida, banco de dados MySQL e conferir
aparece uma tela de configuração. se o registro foi inserido.
Nessa tela, es-
colhemos a cone-
xão com o banco
de dados. O
Dreamweaver au-
tomaticamente
exibe a tabela e
os campos do
banco de dados.
Clicamos em OK.
O Recordset está
configurado.
Nosso formulá-
rio vai inserir re-
gistros no banco Banco de dados: configurando a conexão com o MySQL

106 < C O L E Ç Ã O I N F O
TUTORIAL/LISTA DE DISCUSSÃO 23.05.05 17:34 Page 107

TUTORIAL/LISTA DE DISCUSSÃO

UM FÓRUM CHEIO
DE OPINIÃO
MONTE SEU FÓRUM NA WEB USANDO O PROGRAMA PHPBB
NO CONECTIVA LINUX COM O SERVIDOR APACHE

m fórum é sempre pon- pos de usuários. O administrador tem

U to de destaque em qual-
quer site. As listas de
discussão ajudam pro-
fissionais a encontrar respostas pa-
a possibilidade de ainda limitar o aces-
so à visualização, postagem de res-
postas e muitas outras funções. O
moderador tem poder para apagar,
ra suas dúvidas, servem para com- mover, bloquear ou desbloquear as
partilhar opiniões e unem comuni- mensagens, uma a uma, em bloco ou
dades em torno dos sites. O phpBB, todas de uma só vez.
programa de criação e gerenciamen- Para a personalização, você pode
to de fóruns de discussão, é um dos contar com a utilização de templates
preferidos dos programadores. que ficam guardados separadamen-
Baseado na linguagem PHP, o te do código do PHP, permitindo que
phpBB foi totalmente remodelado na as mudanças de layout sejam feitas
versão 2.0. Seu redesenho está dire- mais facilmente. As fontes e cores uti-
cionado para uma utilização profis- lizadas no seu fórum podem ser con-
sional, com total liberdade de perso- troladas por meio de arquivos de CSS
nalização. Além disso, recebeu me- (Cascading Style Sheets).
lhorias de segurança, in-
terface em múltiplos idio-
mas e suporte aos mais
variados bancos de dados.
O phpBB permite a cria-
ção de uma quantidade
ilimitada de fóruns, orga-
nizados em categorias. A
administração de usuá-
rios, grupos e permissões
é outro destaque do pro-
duto. O controle de aces-
so pode ser especificado
diretamente para os gru- phpBB: configuração em formulário fácil de usar

C O L E Ç Ã O I N F O > 107
TUTORIAL/LISTA DE DISCUSSÃO 23.05.05
TUTORIAL/LISTA DE DISCUSSÃO
Veja, no tutorial a se-
guir, como o phpBB pode
ser instalado e configura-
do com facilidade. Neste
exemplo, usamos a distri-
buição Conectiva do Linux,
banco de dados MySQL e
servidor web Apache.
1. Faça o download do
phpBB em www.info.
abril.com.br/download/
Fórum pronto: áreas delimitadas, com boa leitura
3206.shtml. O arquivo es-
tá no formato ZIP.
Localize o diretório de páginas
do seu servidor web. Normalmen-
te elas ficam guardadas no diretó-
rio: /usr/local/apache/htdocs ou
c:/apache/htdocs.
Descompacte o arquivo baixado
nesse diretório. Ele criará um diretó- http://localhost/phpBB2/
rio /phpBB2.
2. Na linha de comando, digite a se-
guinte seqüência:
chmod a+w config.php
O objetivo é permitir que o PHP
possa alterar o arquivo de configu-
ração para fazer a instalação.
3 . Pelo seu browser, abra o
phpMyAdmin (www.info.abril.com.
br/download/3259.shtml), um pro-
grama que administra o MySQL. Crie
um usuário no MySQL chamado
phpbb. Defina uma senha com per-
missão para:
Host: localhost
Depois disso, na linha de coman-
do do programa phpMyAdmin, digi-
te o seguinte:
flush privileges
108 < C O L E Ç Ã O I N F O
17:34 Page 108
TUTORIAL/LISTA DE DISCUSSÃO
6. Acesse http://localhost/phpBB2/ o fórum (domínio, descrição, e-mail
pelo seu browser e clique em Lo- do administrador e outros itens).
gin. Digite seu nome de usuário e a Ainda no menu, escolha Forum
senha que você escolheu para o ad- Admin/Management. Aqui você po-
ministrador e clique em Log In. Vá de criar um novo fórum facilmente.
até o fim da página e clique em Go Basta colocar o nome do fórum e cli-
to Administration Panel. car em Create New Forum. Preen-
No menu, escolha General Ad- cha a descrição e ele já estará dis-
min/Configuration, para personalizar ponível para uso.
DISCUSSÃO EM PORTUGUÊS
O phpBB oferece pacotes do phpBB, apontando seu
complementares que browser para o servidor local,
traduzem as mensagens dos no endereço
Isso irá ativar o usuário criado.
programas para vários http://127.0.0.1/phpBB2/admin.
Ainda no console do phpMyAdmin,
idiomas. Para obter esse Localize o item General
crie um novo banco de dados cha-
complemento em português Admin/Configuration
mado phpbb.
falado no Brasil, faça o e troque a opção Default
4. Com o browser, acesse o phpBB
download no endereço www. Language para Portuguese
pelo endereço:
info.abril.com.br/download/ [Brazil].
3237.shtml. É um arquivo 3. Volte ao phpBB
Na página de instalação, preencha
zipado com apenas 48 KB. (http://127.0.0.1/phpBB2),
os seguintes campos:
Veja, agora, como instalar clique em Profile e troque
Database Server Hostname / DSN:
esse módulo de idioma. a opção Board Language
localhost
1. Salve o arquivo .zip dentro também para Portuguese
Your Database Name: phpbb
do diretório phpBB2/language [Brazil].
Database Username: phpbb
e descompacte-o
Database Password: phpbb
com o comando
Prefix for tables in database: phpbb_
unziplang_
Escolha também um nome de
portuguese_
usuário para o administrador da lista
brazil.zip. Com
de discussão e uma senha.
isso, será criado
5. Acione o botão Start Install e,
o subdiretório
em seguida, clique no botão Finish
phpBB2/language/
Installation.
lang_portuguese_
Agora, apague os diretórios “ins-
brazil.
tall” e “contrib” e retire os direitos de
2. Acesse a
gravação do arquivo config.php, com
interface de
o seguinte comando:
configuração Idioma: adicionando complemento em português
chmod a-w config.php
C O L E Ç Ã O I N F O > 109
TUTORIAL/LISTA DE DISCUSSÃO 23.05.05
TUTORIAL/LISTA DE DISCUSSÃO
Veja, no tutorial a se-
guir, como o phpBB pode
ser instalado e configura-
do com facilidade. Neste
exemplo, usamos a distri-
buição Conectiva do Linux,
banco de dados MySQL e
servidor web Apache.
1. Faça o download do
phpBB em www.info.
abril.com.br/download/
Fórum pronto: áreas delimitadas, com boa leitura
3206.shtml. O arquivo es-
tá no formato ZIP.
Localize o diretório de páginas
do seu servidor web. Normalmen-
te elas ficam guardadas no diretó-
rio: /usr/local/apache/htdocs ou
c:/apache/htdocs.
Descompacte o arquivo baixado
nesse diretório. Ele criará um diretó- http://localhost/phpBB2/
rio /phpBB2.
2. Na linha de comando, digite a se-
guinte seqüência:
chmod a+w config.php
O objetivo é permitir que o PHP
possa alterar o arquivo de configu-
ração para fazer a instalação.
3 . Pelo seu browser, abra o
phpMyAdmin (www.info.abril.com.
br/download/3259.shtml), um pro-
grama que administra o MySQL. Crie
um usuário no MySQL chamado
phpbb. Defina uma senha com per-
missão para:
Host: localhost
Depois disso, na linha de coman-
do do programa phpMyAdmin, digi-
te o seguinte:
flush privileges
108 < C O L E Ç Ã O I N F O
17:34 Page 108
TUTORIAL/LISTA DE DISCUSSÃO
6. Acesse http://localhost/phpBB2/ o fórum (domínio, descrição, e-mail
pelo seu browser e clique em Lo- do administrador e outros itens).
gin. Digite seu nome de usuário e a Ainda no menu, escolha Forum
senha que você escolheu para o ad- Admin/Management. Aqui você po-
ministrador e clique em Log In. Vá de criar um novo fórum facilmente.
até o fim da página e clique em Go Basta colocar o nome do fórum e cli-
to Administration Panel. car em Create New Forum. Preen-
No menu, escolha General Ad- cha a descrição e ele já estará dis-
min/Configuration, para personalizar ponível para uso.
DISCUSSÃO EM PORTUGUÊS
O phpBB oferece pacotes do phpBB, apontando seu
complementares que browser para o servidor local,
traduzem as mensagens dos no endereço
Isso irá ativar o usuário criado.
programas para vários http://127.0.0.1/phpBB2/admin.
Ainda no console do phpMyAdmin,
idiomas. Para obter esse Localize o item General
crie um novo banco de dados cha-
complemento em português Admin/Configuration
mado phpbb.
falado no Brasil, faça o e troque a opção Default
4. Com o browser, acesse o phpBB
download no endereço www. Language para Portuguese
pelo endereço:
info.abril.com.br/download/ [Brazil].
3237.shtml. É um arquivo 3. Volte ao phpBB
Na página de instalação, preencha
zipado com apenas 48 KB. (http://127.0.0.1/phpBB2),
os seguintes campos:
Veja, agora, como instalar clique em Profile e troque
Database Server Hostname / DSN:
esse módulo de idioma. a opção Board Language
localhost
1. Salve o arquivo .zip dentro também para Portuguese
Your Database Name: phpbb
do diretório phpBB2/language [Brazil].
Database Username: phpbb
e descompacte-o
Database Password: phpbb
com o comando
Prefix for tables in database: phpbb_
unziplang_
Escolha também um nome de
portuguese_
usuário para o administrador da lista
brazil.zip. Com
de discussão e uma senha.
isso, será criado
5. Acione o botão Start Install e,
o subdiretório
em seguida, clique no botão Finish
phpBB2/language/
Installation.
lang_portuguese_
Agora, apague os diretórios “ins-
brazil.
tall” e “contrib” e retire os direitos de
2. Acesse a
gravação do arquivo config.php, com
interface de
o seguinte comando:
configuração Idioma: adicionando complemento em português
chmod a-w config.php
C O L E Ç Ã O I N F O > 109
DOWNLOADS/COISAS LEGAIS 23.05.05
DOWNLOADS/COISAS LEGAIS
PORTAL NO AR
SEM GASTAR NADA
UMA SELEÇÃO ESPERTA DE FERRAMENTAS GRATUITAS
PARA SITES DINÂMICOS
POR DANIEL AVIZU
ão é preciso ter conta ban-
N cária recheada para criar
um site dinâmico reple-
to de recursos. Com as fer-
ramentas gratuitas que selecionamos,
qualquer um pode criar um portal ra-
pidamente. A seguir, você vai conhecer
opções de gerenciadores de conteúdo,
banco de dados, temas tableless, in-
terpretadores e muito mais. Aproveite.
> WEBGUI 6.2.11
Plain Black
www.info.abril.com.br/download/4195.shtml
AVALIAÇÃO TÉCNICA:
CUSTO/BENEFÍCIO:
WebGUI: o instalador configura tudo
110 < C O L E Ç Ã O I N F O
18:27 Page 110
Disponível para Windows e Linux,
esse gerenciador de conteúdo
(CMS) tem uma interface muito
amigável. Nela é possível alterar
a posição dos elementos da pági-
na apenas arrastando-os. Além dis-
so, já vem com vários componen-
tes que facilitam a vida do web-
master, como enquete, fórum, ca-
lendário de eventos, gerenciador
de arquivos, geração automática
de formulários e mapa automáti-
co do site. Na hora de colocar no
ar um box de busca, por exemplo,
7,0 com poucos cliques dá para esco-
lher entre as opções normal, avan-
çada e por assunto. Sua versão pa-
ra Windows conta ainda com um
instalador, o All-In-One, que ins-
tala e configura automaticamente
todos os programas necessários
para a sua execução: Apache 2.0.50,
PHP 4.3.7, MySQL, mySQLadmin, Perl
5.8.4, ImageMagik 5.5.7 e, opcio-
nalmente, o suporte ao OpenSSL.
Apesar desta comodidade, o Web-
GUI também pode ser utilizado
com outros servidores web, como
o IIS, da Microsoft.
LIVRE, 47,7 MB, EM INGLÊS
Mambo: gerencia banner e newsfeeds
> MAMBO 4.5.1B
Miro International
www.info.abril.com.br/download/4196.shtml
AVALIAÇÃO TÉCNICA: 7,0
CUSTO/BENEFÍCIO:
O Mambo é um gerenciador de con-
teúdo para todo o tipo de obra.
De um lado, atende até o usuário de
hosting básico, sem acesso a um shell
e sem os privilégios de administra-
dor. De outro, traz consigo um con-
junto de ferramentas de gente gran-
de, como gerenciador de banners,
alimentador de notícias de parceiros
(newsfeed) e syndication, para distri-
buir os artigos do site no padrão RSS.
Conta também com componentes
para enquete, busca e gerenciamen-
to de mídia, além de uma das maio-
res comunidades de usuários na in-
ternet, o que proporciona uma lon-
ga lista de sites com templates, mó-
dulos e muitos fóruns de discussão.
Por ser baseado na web, roda em qual-
quer sistema operacional, mas des-
de que este possua um servidor web
compatível com PHP, como o Apache,
o IIS ou o iPlanet, por exemplo.
LIVRE, 1,5 MB, EM INGLÊS
DOWNLOADS/COISAS LEGAIS
> DRUPAL 4.6.0
Drupal
www.info.abril.com.br/download/4197.shtml
AVALIAÇÃO TÉCNICA: 6,0
CUSTO/BENEFÍCIO:
Para quem precisa de uma ferra-
menta de gerenciamento de con-
teúdo mais enxuta e que vá direto
ao que interessa, o Drupal é uma
boa opção. Sua interface é simples
e focada na publicação das páginas,
deixando de lado toda a pirotecnia
dos concorrentes. Mas isso não quer
dizer que ele seja carente de recur-
sos, pelo contrário. Debaixo de sua
austeridade, o Drupal abriga ferra-
mentas valiosas, como blog, blogApi
para publicação via XML-RPC, rela-
tório de acessos, fórum, adição de
comentários e distribuição de con-
teúdo via RSS. Conta ainda com o
DrupalID, recurso que notifica um
servidor central sobre a existência
do seu site e eventuais problemas
que possam ocorrer. Entre os vários
módulos disponíveis, há um tradu-
tor para o português do Brasil.
LIVRE, 452 KB, EM INGLÊS
Drupal: software enxuto e poderoso
C O L E Ç Ã O I N F O > 111
DOWNLOADS/COISAS LEGAIS 23.05.05
DOWNLOADS/COISAS LEGAIS
PORTAL NO AR
SEM GASTAR NADA
UMA SELEÇÃO ESPERTA DE FERRAMENTAS GRATUITAS
PARA SITES DINÂMICOS
POR DANIEL AVIZU
ão é preciso ter conta ban-
N cária recheada para criar
um site dinâmico reple-
to de recursos. Com as fer-
ramentas gratuitas que selecionamos,
qualquer um pode criar um portal ra-
pidamente. A seguir, você vai conhecer
opções de gerenciadores de conteúdo,
banco de dados, temas tableless, in-
terpretadores e muito mais. Aproveite.
> WEBGUI 6.2.11
Plain Black
www.info.abril.com.br/download/4195.shtml
AVALIAÇÃO TÉCNICA:
CUSTO/BENEFÍCIO:
WebGUI: o instalador configura tudo
110 < C O L E Ç Ã O I N F O
18:27 Page 110
Disponível para Windows e Linux,
esse gerenciador de conteúdo
(CMS) tem uma interface muito
amigável. Nela é possível alterar
a posição dos elementos da pági-
na apenas arrastando-os. Além dis-
so, já vem com vários componen-
tes que facilitam a vida do web-
master, como enquete, fórum, ca-
lendário de eventos, gerenciador
de arquivos, geração automática
de formulários e mapa automáti-
co do site. Na hora de colocar no
ar um box de busca, por exemplo,
7,0 com poucos cliques dá para esco-
lher entre as opções normal, avan-
çada e por assunto. Sua versão pa-
ra Windows conta ainda com um
instalador, o All-In-One, que ins-
tala e configura automaticamente
todos os programas necessários
para a sua execução: Apache 2.0.50,
PHP 4.3.7, MySQL, mySQLadmin, Perl
5.8.4, ImageMagik 5.5.7 e, opcio-
nalmente, o suporte ao OpenSSL.
Apesar desta comodidade, o Web-
GUI também pode ser utilizado
com outros servidores web, como
o IIS, da Microsoft.
LIVRE, 47,7 MB, EM INGLÊS
Mambo: gerencia banner e newsfeeds
> MAMBO 4.5.1B
Miro International
www.info.abril.com.br/download/4196.shtml
AVALIAÇÃO TÉCNICA: 7,0
CUSTO/BENEFÍCIO:
O Mambo é um gerenciador de con-
teúdo para todo o tipo de obra.
De um lado, atende até o usuário de
hosting básico, sem acesso a um shell
e sem os privilégios de administra-
dor. De outro, traz consigo um con-
junto de ferramentas de gente gran-
de, como gerenciador de banners,
alimentador de notícias de parceiros
(newsfeed) e syndication, para distri-
buir os artigos do site no padrão RSS.
Conta também com componentes
para enquete, busca e gerenciamen-
to de mídia, além de uma das maio-
res comunidades de usuários na in-
ternet, o que proporciona uma lon-
ga lista de sites com templates, mó-
dulos e muitos fóruns de discussão.
Por ser baseado na web, roda em qual-
quer sistema operacional, mas des-
de que este possua um servidor web
compatível com PHP, como o Apache,
o IIS ou o iPlanet, por exemplo.
LIVRE, 1,5 MB, EM INGLÊS
DOWNLOADS/COISAS LEGAIS
> DRUPAL 4.6.0
Drupal
www.info.abril.com.br/download/4197.shtml
AVALIAÇÃO TÉCNICA: 6,0
CUSTO/BENEFÍCIO:
Para quem precisa de uma ferra-
menta de gerenciamento de con-
teúdo mais enxuta e que vá direto
ao que interessa, o Drupal é uma
boa opção. Sua interface é simples
e focada na publicação das páginas,
deixando de lado toda a pirotecnia
dos concorrentes. Mas isso não quer
dizer que ele seja carente de recur-
sos, pelo contrário. Debaixo de sua
austeridade, o Drupal abriga ferra-
mentas valiosas, como blog, blogApi
para publicação via XML-RPC, rela-
tório de acessos, fórum, adição de
comentários e distribuição de con-
teúdo via RSS. Conta ainda com o
DrupalID, recurso que notifica um
servidor central sobre a existência
do seu site e eventuais problemas
que possam ocorrer. Entre os vários
módulos disponíveis, há um tradu-
tor para o português do Brasil.
LIVRE, 452 KB, EM INGLÊS
Drupal: software enxuto e poderoso
C O L E Ç Ã O I N F O > 111
DOWNLOADS/COISAS LEGAIS 23.05.05 18:28
DOWNLOADS/COISAS LEGAIS
PostNuke: gerenciador colaborativo
> POSTNUKE 0.750
PostNuke
www.info.abril.com.br/download/4198.shtml
AVALIAÇÃO TÉCNICA: 6,5
CUSTO/BENEFÍCIO:
O PostNuke é mais que um CMS, é
um gerenciador colaborativo de con-
teúdo e comunidades. Nele é possí-
vel organizar grupos de colaborado-
res para o site, cada um com a sua
função, com cotas e acessos diferen-
ciados. Na tela, ele indica quais os
membros que estão online e qual a
sua produtividade. O software conta
também com módulos de gerencia-
mento de banners, fóruns, blogs, con-
teúdo para PDAs, busca, envio de
mensagens e estatísticas de acesso.
LIVRE, 3,25 MB, EM INGLÊS
> 3 COLUMN TABLELESS THEME
PortalThemes
www.info.abril.com.br/download/4199.shtml
AVALIAÇÃO TÉCNICA: 6,5
CUSTO/BENEFÍCIO:
Este tema para o PostNuke não uti-
liza tabelas para dar forma à página
HTML. Em seu lugar, usa um CSS (Cas-
112 < C O L E Ç Ã O I N F O
Page 112
cading Style Sheets), que é capaz de
colocar os elementos em seus luga-
res, poupando código e, conseqüen-
temente, acelerando o download da
página. No site www.portalthemes.
com há uma grande variedade de te-
mas com visuais dos mais variados.
Há também o site themes.postnuke.
com, da própria PostNuke, que reú-
ne temas de diferentes fornecedo-
res, alguns grátis e outros, não.
LIVRE, 350 KB, EM INGLÊS
3 Column: tema tableless para PostNuke
> MILLENNIUM EARTH
Peekmambo
www.info.abril.com.br/download/4200.shtml
AVALIAÇÃO TÉCNICA: 6,0
CUSTO/BENEFÍCIO:
O template da peekmambo para
Mambo possui links configuráveis
e largura fixa. Se a imagem da Ter-
ra não agradar, faça o cadastro no
site do fabricante (www.peek-
mambo.com) e baixe algum ou-
tro membro da família Millennium,
como o Keyboard ou o Flower, por
exemplo. Existem inúmeros sites
que oferecem downloads de com-
Millenium Earth: template para Mambo
ponentes e templates para Mam-
bo, como é o caso do www.free-
mambo.com e do www.mambo-
dev.com. A febre é tamanha, que
já existem portais, como o www.
mamboawards.com, que montam
um ranking, dividido em várias ca-
tegorias, dos melhores sites de-
senvolvidos com Mambo.
LIVRE, 153 KB, EM INGLÊS
> POSTGRESQL 8.0.2
PostgreSQL Global Development
Group
www.info.abril.com.br/download/4119.shtml
AVALIAÇÃO TÉCNICA: 7,5
CUSTO/BENEFÍCIO:
Para quem precisa de um banco de
dados relacional confiável e compa-
tível com a maioria dos softwares li-
vres, o PostgreSQL é uma ótima so-
lução. Diferentemente dos bancos de
dados tradicionais, o PostgreSQL pos-
sui um sistema de controle transacio-
nal que isola cada sessão entre a apli-
cação e o banco. O MVCC (Multiver-
sion Concurrency Control) faz com
que a transação se dê com uma foto
DOWNLOADS/COISAS LEGAIS
do banco tirada no momento ante-
rior. A vantagem disso é que uma
query de leitura nunca terá de espe-
rar que uma query de escrita termi-
ne para que possa ser executada e
vice-versa. Mas é na hora de escre-
ver stored procedures, os scripts SQL,
que o PostgreSQL dá um show. Ele
aceita que sejam escritos em SQL,
TCL, Perl ou Python, e se isso não for
suficiente, ainda é possível criar uma
nova linguagem de script para ele.
LIVRE, 17,6 MB, EM INGLÊS
> PHPPGADMIN 3.5.3
phpPgAdmin Project
www.info.abril.com.br/download/3261.shtml
AVALIAÇÃO TÉCNICA: 7,5
CUSTO/BENEFÍCIO:
Para os usuários do PostgreSQL, já
se foi a época em que administrar
o banco de dados era missão ape-
nas para escovadores de bits. Todas
aquelas tarefas chatas de criação
dos usuários, dos bancos e das ta-
belas agora podem ser feitas numa
interface amigável e sem dores de
cabeça. Além da interface web, o
phpPgAdmin possui outras como-
phpPgAdmin: interface amigável
C O L E Ç Ã O I N F O > 113
DOWNLOADS/COISAS LEGAIS 23.05.05 18:28
DOWNLOADS/COISAS LEGAIS
PostNuke: gerenciador colaborativo
> POSTNUKE 0.750
PostNuke
www.info.abril.com.br/download/4198.shtml
AVALIAÇÃO TÉCNICA: 6,5
CUSTO/BENEFÍCIO:
O PostNuke é mais que um CMS, é
um gerenciador colaborativo de con-
teúdo e comunidades. Nele é possí-
vel organizar grupos de colaborado-
res para o site, cada um com a sua
função, com cotas e acessos diferen-
ciados. Na tela, ele indica quais os
membros que estão online e qual a
sua produtividade. O software conta
também com módulos de gerencia-
mento de banners, fóruns, blogs, con-
teúdo para PDAs, busca, envio de
mensagens e estatísticas de acesso.
LIVRE, 3,25 MB, EM INGLÊS
> 3 COLUMN TABLELESS THEME
PortalThemes
www.info.abril.com.br/download/4199.shtml
AVALIAÇÃO TÉCNICA: 6,5
CUSTO/BENEFÍCIO:
Este tema para o PostNuke não uti-
liza tabelas para dar forma à página
HTML. Em seu lugar, usa um CSS (Cas-
112 < C O L E Ç Ã O I N F O
Page 112
cading Style Sheets), que é capaz de
colocar os elementos em seus luga-
res, poupando código e, conseqüen-
temente, acelerando o download da
página. No site www.portalthemes.
com há uma grande variedade de te-
mas com visuais dos mais variados.
Há também o site themes.postnuke.
com, da própria PostNuke, que reú-
ne temas de diferentes fornecedo-
res, alguns grátis e outros, não.
LIVRE, 350 KB, EM INGLÊS
3 Column: tema tableless para PostNuke
> MILLENNIUM EARTH
Peekmambo
www.info.abril.com.br/download/4200.shtml
AVALIAÇÃO TÉCNICA: 6,0
CUSTO/BENEFÍCIO:
O template da peekmambo para
Mambo possui links configuráveis
e largura fixa. Se a imagem da Ter-
ra não agradar, faça o cadastro no
site do fabricante (www.peek-
mambo.com) e baixe algum ou-
tro membro da família Millennium,
como o Keyboard ou o Flower, por
exemplo. Existem inúmeros sites
que oferecem downloads de com-
Millenium Earth: template para Mambo
ponentes e templates para Mam-
bo, como é o caso do www.free-
mambo.com e do www.mambo-
dev.com. A febre é tamanha, que
já existem portais, como o www.
mamboawards.com, que montam
um ranking, dividido em várias ca-
tegorias, dos melhores sites de-
senvolvidos com Mambo.
LIVRE, 153 KB, EM INGLÊS
> POSTGRESQL 8.0.2
PostgreSQL Global Development
Group
www.info.abril.com.br/download/4119.shtml
AVALIAÇÃO TÉCNICA: 7,5
CUSTO/BENEFÍCIO:
Para quem precisa de um banco de
dados relacional confiável e compa-
tível com a maioria dos softwares li-
vres, o PostgreSQL é uma ótima so-
lução. Diferentemente dos bancos de
dados tradicionais, o PostgreSQL pos-
sui um sistema de controle transacio-
nal que isola cada sessão entre a apli-
cação e o banco. O MVCC (Multiver-
sion Concurrency Control) faz com
que a transação se dê com uma foto
DOWNLOADS/COISAS LEGAIS
do banco tirada no momento ante-
rior. A vantagem disso é que uma
query de leitura nunca terá de espe-
rar que uma query de escrita termi-
ne para que possa ser executada e
vice-versa. Mas é na hora de escre-
ver stored procedures, os scripts SQL,
que o PostgreSQL dá um show. Ele
aceita que sejam escritos em SQL,
TCL, Perl ou Python, e se isso não for
suficiente, ainda é possível criar uma
nova linguagem de script para ele.
LIVRE, 17,6 MB, EM INGLÊS
> PHPPGADMIN 3.5.3
phpPgAdmin Project
www.info.abril.com.br/download/3261.shtml
AVALIAÇÃO TÉCNICA: 7,5
CUSTO/BENEFÍCIO:
Para os usuários do PostgreSQL, já
se foi a época em que administrar
o banco de dados era missão ape-
nas para escovadores de bits. Todas
aquelas tarefas chatas de criação
dos usuários, dos bancos e das ta-
belas agora podem ser feitas numa
interface amigável e sem dores de
cabeça. Além da interface web, o
phpPgAdmin possui outras como-
phpPgAdmin: interface amigável
C O L E Ç Ã O I N F O > 113
DOWNLOADS/COISAS LEGAIS 23.05.05
DOWNLOADS/COISAS LEGAIS
didades, como ajuda em praticamen-
te todas as funções, assistentes pa-
ra a criação de tabelas, usuários,
views e stored procedures.
LIVRE, 740 KB, EM PORTUGUÊS
> ZOPE 2.7.5
Zope
www.info.abril.com.br/download/1780.shl
AVALIAÇÃO TÉCNICA:
CUSTO/BENEFÍCIO:
O Zope é um pacote versátil para a
criação de aplicações web, compe-
tindo com produtos como ColdFu-
sion, WebSphere e Oracle AS e lin-
guagens como ASP e PHP. Apesar de
não ser tão completo como os con-
correntes, é facilmente complemen-
tável com outros produtos, módulos
prontos (disponíveis no site oficial)
e sistemas desenvolvidos pelo pró-
prio usuário. O Zope utiliza Python
2.1 como linguagem interna, o que
lhe dá flexibilidade e poder muito
grandes. Além disso, possui um sis-
tema muito bom de gerenciamento
de usuários, permitindo hierarqui-
zar e determinar direitos de acesso
para todas as páginas ou grupos de
Zope: criação de aplicações web
114 < C O L E Ç Ã O I N F O
18:28 Page 114
páginas do site. É compatível com
os web servers mais populares, co-
mo o Apache e o IIS.
LIVRE, 9 MB, EM INGLÊS
7,7
DBDesigner: modelagem de dados
> DBDESIGNER 4.0.5.6
fabFORCE.net
www.info.abril.com.br/download/3681.shl
AVALIAÇÃO TÉCNICA: 6,5
CUSTO/BENEFÍCIO:
Opção gratuita de ferramenta para
modelagem de bancos de dados. Po-
de criar relacionamentos e tabelas
de forma visual, além de importar
essas informações de bancos de da-
dos existentes. Foi criado para usuá-
rios do MySQL, mas também funcio-
na com outros sistemas gerenciado-
res de bancos de dados. Além do mo-
do de desenho, usado para enxer-
gar as tabelas e suas relações de for-
ma visual, o DBDesigner também cria
comandos SQL para facilitar o de-
senvolvimento com base no banco
existente. Outro ponto positivo é o
suporte a controle de versão, útil pa-
ra projetos grandes onde as mudan-
ças podem ter de ser revertidas.
LIVRE, 5,6 MB, EM INGLÊS