CMS – Gerenciadores de conteúdo

Dicas, links e sites úteis sobre / para / de WordPress

Instalação manual do WordPress 3.2.1Temas-filhoTraduzindo o WordPress • Links úteis WP • Joomla

Procura serviços de webdesign, no Rio de Janeiro (RJ)? Entre em contato: Wallace Vianna, designer.

Wallace Vianna é webdesigner no Rio de Janeiro RJ.

Instalação manual do WordPress 3.x (*)

Segue aqui passo-a-passo resumido de como instalar o WordPress (WP) versão 3.x na internet, em um provedor de hospedagem, manualmente (sem instaladores automáticos como o SimpleScripts ou o Fantástico DeLuxe). Vantagem: o WP já estará em português, simplificando seu uso, dispensando tradução posterior.

(*) ainda válido em grande parte para o WP 4.X

Importante: para seguir esse tutorial você tem de:

  • Contratar hospedagem de site na internet, para instalar o WordPress; essa hospedagem tem de dar suporte a Banco de Dados MySQL
  • Saber usar o Windows Explorer ou programa de FTP para enviar, baixar, excluir, copiar ou mover arquivos para a internet
  • Saber baixar e descompactar arquivos em seu computador

Assim sendo,

  • Baixe o WordPress (em português) do site www.wordpress.org  (o site vai detectar de que região do mundo você está e vai exibir o link “Português do Brasil”); escolha o arquivo com extensão .ZIP
  • Descompacte o arquivo em seu computador
  • Acesse a hospedagem de seu site na internet. Ao contratar uma hospedagem o provedor lhe fornecerá dados de acesso aos srquivos de seu site (FTP): nome do host, usuário e senha.
    Ex.: ftp.seunome.com; usuário: seunome; senha: seunome.
    Você pode usar o Windows Explorer para fazer esse acesso ou usar um programa como o Filezilla.
  • Crie uma pasta na pasta-raiz de seu site (“www” ou “public_html“) com o nome de seu site/blog (exs.: public_html/seusite ou www/seublog)
  • Copie os arquivos de seu WordPress para essa pasta
  • Acesse a pasta de seu wordpress em seu navegador: (ex.: http://www.seunome.com/seusite ou http://www.seunome.com/seublog)

A tela a seguir deverá paraecr patra você; neste exemplo, usamos o WordPress versão 3.2.1

  • O WP tentará criar um arquivo chamado wp-config.php para você. Se não conseguir…

  • … volte a tela inicial (acima) e clique no link “Nós temos”; você verá uma página do site WordPress.org com informações sobre como criar o arquivo wp-config.php

  • Se você clicar no link “Crie um arquivo de configuração” (primeira tela), e o WP conseguir criar o arquivo wp-config.php para você, a tela a seguir irá aparecer:

Antes de clicar em”Vamos lá”…

  • …você deverá abrir outra janela de seu navegador e acessar a sua hospedagem de site na internet e criar um banco de dados para o WP.
  • Neste exemplo, a hospedagem foi contratada na empresa http://www.linkws.com/, pois possui um instalador de banco de dados, o que simplifica o processo.
  • Acesse o LinkWS e contrate uma hospedagem (plano mínimo, com suporte a banco de dados MySQL).

Observação: Você pode contratar uma hospedagem gratuita, mas terá de usar um instalador automático (que lhe dará um WP em inglês) ou configurar o banco de dados manualmente. Não tratarei aqui de como criar um banco de dados manualmente, sem um assistente de criação.

  • Após contratar a hospedagem acesse o seu painel de controle, na LinkWS:

  • Procure Banco de dados > Assistente de banco de dados MySQL

  • Neste ponto você dispõe de um assistente para criar seu banco de dados para oWP, além de uma videoaula sobre como proceder nas etapas seguintes.
  • Digite o nome de seu banco de dados (nome de seu site ou blog no WP; p.ex.: seunome)

  • Neste passo 2, digite o nome de usuário do banco de dados e senha (ex.: Usuário: seunome; Senha: seunome)

  • Neste passo 3, clique em “Todos os privilégios”

  • Neste passo 4 o banco de dados está criado. Clique em “Adicionar outro usuário (…)” para ver as informações de seu Banco de Dados (BD) e copia-las para a instalação do WP.

  • Aqui estão as informações de seu Banco de dados; anote ou deixe esta tela aberta até concluir a instalação do WP.

  • Volte ao WP e clique no botão “Vamos lá” (terceira tela deste tutorial) para continuar a instalação do WP.
  • Digite aqui os dados de seu BD na LinkWS: Nome do BD; Nome de usuário (do BD); Senha (do BD); deixe os campos “Servidor do BD e Prefixo das tabelas como estão.
  • Clique em “Enviar”

Observação: Se por acaso não conseguir instalar o WP no seu provedor de hospedagem, volte a tela anterior (acima) e tente descobrir com o suporte técnico da hospedagem qual o nome do Servidor de BD (que pode não ser Localhost) e acrescente esta informação.

  • Se você conseguiu inserir a informação que faltava na tela anterior e clicou em “Enviar” a pequena tela abaixo aparecerá para você. Clique em “começar a instalação”. Se tudo correr bem…

  • …você chegará a esta outra tela, para inserir informações sobre o seu WP:
    Título do site (ex.: site seu nome); Nome de susário (ex.: seunome); Senha (ex.: seunome); Endereço de email (ex.: seunome@provedor.com)
  • Anote seu login e senha.
  • Clique em “Instalar WordPress”

  • O WP terminou de ser instalado. Clique em “Login”.

  • Nesta tela abaixo você digita o seu login e senha de acesso ao WP.

  • Aqui está o Painel de controle do WP para inserir conteúdo e configurar sua aparência e funcionamento.
  • Para ver o blog/site clique no nome de seu blog, no canto superior esquerdo da tela e escolha “Visitar site”.

  • Enquanto estiver acessando o WP uma barra de navegação preta ficará disponível no topo da tela para acessar as funções básicas do WP.
  • Para fechar o WP procure seu nome no canto superior direito da tela e clique em “Sair”.

Parabéns, você pode começar a usar o WP a partir de agora.

Criando temas e temas-filhos no WordPress

(Atualizado em 27.12.2012 e 02.02.2013)

Intridução:

Temas-filho até a versão 3.3 do WordPress  eram uma forma de criar um modelo de site personalizado, a partir de um tema do WP existente.

A partir da versão 3.3.x os tema-filho aparentemente mudaram no WP sem aviso prévio. Tentei obter uma resposta da comunidade WP sem sucesso, o que me levou a algumas conclusões que compartilho aqui.

Em tempo, quem tiver mais informações sobre esse assunto, poste seus comentários nesta página.

Para realizar esse tutorial, você precisa :

  • ter o WP instalado, com um tema padrão ativo (neste exemplo, o TwentyTen)
  • saber usar FTP para enviar e baixar arquivos
  • saber usar um programa editor de imagem para criar a miniatura de seu tema-filho
  • saber usar o Bloco de Notas do seu Sistema Operacional (S.O.) – Windows – ou um editor de código como o Super NoteTab Light ou o Dreamweaver
  • saber o mínimo de CSS/Folhas de estilo para mudar a aparência do tema-filho

Neste exemplo, o WP esta instalado em:
http://www.seunome.com/pastaWP

Para criar um tema personalizado no WP 3.3.X em diante  você deve copiar um tema do WP renomeando-o para um nome qualquer.
P.ex.,  copie a pasta localizada em
pastaWP/wp-content/themes/[tema ativo ou twentyten]
para
pastaWP/wp-content/themes/[ tema ativo-seunome ou twentyten-seunome]

Atere a imagem SCREENSHOT.PNG (miniatura do layout de seu tema) para o desenho que seu tema terá, após você alterá-lo.

Para editar o seu tema-filho, vá em

  • Procure Aparência > editor
  • Se você já tornou esse tema ativo, o arquivo que irá aparecer será o style.css,. com a folha de estilos de seu modelo.
  • No início de seu arquivo style.css faça as seguintes substituições nos comentários para alterar a descrição de seu tema:

/*
Theme Name: [“tema ativo SeuNome” ou “Twenty Ten SeuNome”]
Theme URI: http://www.seuWP.com.br
Description: Tema-filho baseado no [tema ativo ou] Twenty-ten do WordPress;
Author: Seu Nome
Version: 1
License: GNU General Public License v2 ou maior
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: uma coluna, largura fixa, fundo de página colorido
Text Domain: [“tema ativo” ou “twentyten”]
*/

  • Procure Aparência > Temas
  • O seu tema-filho deve estar relacionado ali: [tema ativo-seunome ou] twentyten-seunome
  • Para aplicar esse tema, clique em Ativar

Como criar um tema-filho no WP até a versão 3.3

Os arquivos básicos para você começar um tema-filho são:

  • STYLE.CSS: folha de estilos  (CSS) com a formnatação (aparência e posicionamento) do layout de seu modelo-filho;
  • SCREENSHOT.PNG: imagem em miniatura de seu modelo/template (ou modelo-filho/child-template). Mede 300 x 225 píxels, e deve ficar na raiz de seu modelo(-filho)
  • Quaisquer arquivos de modelo (index.php, single.php)

Você pode copiar esses arquivos do seu tema principal; neste exemplo, o TwentyTen, que está na instalação de seu WordPress (ou o tema ativo):
pastaWP/wp-content/themes/twentyten [ou o tema ativo]

  • Crie a pasta do modelo-filho:
    pastaWP/wp-content/themes/twentyten-filho (ou tema ativo-filho)
  • Copie os arquivos de modelo (os exemplos citados acima), o style.css e screenshot.png da pasta TwentyTen (ou tema ativo) para TwentyTen-filho (ou tema ativo-filho) na sua instalação do WP:
    Se estiver instalado na Internet*, será algo como
    [pasta do WortdPress]/wp-content/themes/twentyten-filho  [ou tema ativo-filho]
    P.ex.: http://www.seunome.com/pastaWP/wp-content/themes/twentyten-filho [ou tema ativo-filho]
  • Abra o arquivo style.css, no seu WP e apague todo seu conteudo e digite:

/*
Theme Name: TwentyeTen-Filho (ou tema ativo-filho)
URI: http://www.seuWP.com
Description: Tema-filho para o tema Twentyten  (ou tema ativo)
Author: Seu nome
Author URI: http://www.seusite.com
Template: twentyten 0.1.0 (ou tema ativo 0.0.0)
*/

  @import url(“../twentyten/style.css”); [ou @import url(“../tema ativo/style.css”);]

  • Salve as alterações.
  • Abra o arquivo screenshot.png no seu computador, num programa de edição de imagem e faça a imagem do  que será o cabeçalho de seu tema-filho, quando estiver pronto.
  • Copie o screenshot.png de volta para a pasta twentyten-filho (ou tema ativo-filho) na sua instalação do WP na internet:
    [pasta do WortdPress]/wp-content/themes/twentyten-filho (ou tema ativo-filho)
  • Abra o seu site feito no WP:
    http://www.seunome.com/pastaWP
    observe que ele possui uma descrição, algo como “Apenas mais um site feito no WordPress”/”Just another WordPress ssite”
  • Abra a administração de seu WP:
    http://www.seunome.com/wp-admin
    > login:
    seuNome; senha: suaSenha
  • Procure Aparência > Temas
  • O seu tema-filho deve estar relacionado ali: TwentyTen-Filho (ou tema ativo-filho)
  • Para aplicar esse tema, clique em Ativar
  • A partir de agora você pode editar seu tema-filho: acesse Aparência > Editor
  • Abaixo de@import url(“../twentyten/style.css”); [ou @import url(“../tema ativo/style.css”);]

    digite:

#site-description { display: none } (ou outra seção de seu tema ativo [**])

Você pode remover áreas do WP ou alterar o colorido, posição ou formatação (aparência) de todos os elementos do seu tema-filho no WP, editando o style.css.

Como esse assunto é mais extenso do que descrevo aqui, segue abaixo outros tutoriais sobre Temas-Filho, mais completos, na internet:
op111.net (ingl)
codex.wordpress (ingl. e port.)

Notas:
* Você tem a opção de instalar o WP em seu computador, usando um PWS (Personal Web Server ou Servidor Pessoal de Internet), como o XAMMP, e depois migrar seu WP para a internet.
Não explico esse processo aqui para facilitar a explicação; para instalar o WordPress (WP) localmente em seu computador (Windows) acesse este link do WordPress.org (parcialmente traduzido para português) ou este outro link da página em português do wikihow.

** Para descobrir o nome das seções de seu tema/modelo/template em WP terá de usar um navegador que suporte  o recurso “inspecionar elemento” da página (como o Google Chrome, Firefox ou Opera). Para maiores informações acesse esse link.

Traduzindo o WordPress (atualizado em 09.12.2014)

Se sua instalação do WordPress está em idioma estrangeiro (inglês ,p.ex.)

1) você pode procurar e baixar os arquivos de tradução do WP daqui;
neste caso,

  • procure a versão do seu WP; por exemplo:
    3.3.2 > dist > wp-content > languages
    e baixe o arquivo de idioma (neste exemplo, o “pt_BR.php“)
  • Crie em sua instalação do WP a pasta “languages” dentro de wp-content;
    neste exemplo em:
    http://www.seunome.com/seusite/wp-content/languages
    ou
    seusite/wp-content/languages
  • Copie o arquivo wp-config.php, que fica no diretório raiz da instalação
    neste exemplo, em:
    http://www.seunome.com/seusite
    ou
    seusite
    para seu computador
  • Procure a linha
    define('WPLANG', '');
     e acrescente pt_BR dentro das ultimas aspas simples
    define('WPLANG', 'pt_BR');
  • Abra-o no Bloco de notas do Windows ou no seu editor de código (Dreamweaver ou Super NoteTab Light)
  • Salve e envie o arquivo wp-config.php para o seu WordPress
    neste exemplo, em:
    http://www.seunome.com/seusite
    ou
    seusite
    Acesse a administração do seu WordPress novamente, para vê-lo em seu idioma (português do Brasil).

2. Se não achar os arquivos de idioma no link anterior,

  • baixe a versão do seu WordPress do site brasileiro do WordPress
  • Crie em seu WordPress a pasta wp-content/languages
  • Copie os arquivos de idioma da pasta wp-content/languages para a mesma pasta, em seu WordPress
  • Copie o arquivo wp-config.php, que fica no diretório raiz da sua instalação do WP
    neste exemplo, em:
    http://www.seunome.com/seusite
    ou
    seusite
    para seu computador
  • Abra-o no editor de textos/código (Bloco de notas) e procure a linha
    define('WPLANG', '');
     e acrescente pt_BR dentro das ultimas aspas simples
    define('WPLANG', 'pt_BR');
  • Salve e envie o arquivo wp-config.php para o seu WordPress
    neste exemplo, em:
    http://www.seunome.com/seusite
    ou
    seusite
    Acesse a administração do seu WordPress novamente, para vê-lo em seu idioma (português do Brasil).

3. Se seu WordPress é a versão 4 em diante, verifique se em Configurações/Settings > Geral se a opção Idioma do site está configurada para Português do Brasil

wp-idioma

Fontes: experiência pessoal e WordPress.org

Links úteis para WordPress

Dúvidas, perguntas e respostas

Fórum brasileiro WP

Codex WordPress Português e Inglês
Sítio oficial sobre como usar e administrar o WP

Estrutura do WordPress
layout x arquivos (ingl.)
organização de conteúdo e arquivos no WP

Tradução idioma do WordPress
WordPress no seu idioma (ingl.)
Instalando o WordPress no seu idioma
Arquivo de tradução do WordPress em português

 

Escola WP
Modelos, tutoriais sobre WordPress (gratuitos)

Plug-ins WP

Plug-ins WP Site oficial

Formulários
Formulário Oficial WordPress

Menus WP
Dropdown menu widget (menu com submenus, horizontais e verticais; gratuito)
AllWeb (plug-in gratuito, editor do menu pago)

Galeria de fotos WP
NextGen (integrada ao WP, site oficial). Tradução do NextGen.
25 galerias WP (Dynamic WP)
10 Modelos WP para galerias WP (escola WP)

Mídia
SWF OBJ (inserir flash em seu site)
EasyTube (plugin fácil de usar para vídeos do YouTube e Vimeo)
WordTube Vídeo (swf, flv, mp3 e imagens)
Viper’s Video Quicktags (videologs e outros formatos de vídeo dentro do site: WMV, MOV, FLV etc)
WP Video Plugin (plugin para diversos serviços de vídeo online)

Lista de 12 plugins WP para vídeo (WordPress BR; há outras indicações além dos 12 plugins)

Utilitários
Editor de SEO (facilita inserir dados de otimização do WP para buscadores de internet)
DB Manager (copia de banco de dados WP; útil para migrar WP)
BackUp WordPress (cópia de segurança WP, apenas)
Client proof visual editor (opções para restringir edição de posts em modo administrador)
Advanced code editor (só para navegadores que rconhecem HTML 5)
Simple traffic widget (contador de acessos simples e fácil de usar/personalizar)

Modelos/temas WP

Criando modelos no WordPress: inglês e português

Temas-filho (child themes)
op111.net (ingl)
codex.wordpress (ingl. e port.)

Sandbox
Modelo clássico para desenvolvimento de modelos do WP

Gratuitos

Modelos WordPress.org • Themes.Wordpress.com
Modelos gratuitos e oficiais do WP

Tudo Para WordPress 

WP Total

FabThemes

WPMUDev

Modelos gratuitos de BLOG
Modelos gratuitos de blogs, do Blogger/Wordpress; permite baixar o modelo por completo, procurando por autor/layout de blog.

Templates Gratis.org

Links para sites de modelos gratuitos:

EscolaWP • Fresh Design WebBons Tutoriais • Quero Criar um Blog 

Pagos

WordPress Graphics
Modelos de Blog do WordPress (pagos)

 Links úteis WordPress (dicas e resolvendo problemas)

Dicas úteis WordPress / WP (resolvendo problemas)

  • Exibir/ocultar comentários: quando você define que os comentários serão (ou não) exibidos no WP isso vale para as NOVAS páginas ou posts criados.  Os posts/páginas anteriores permanecem com as configurações do momento da criação.
  • Trocando a localização/posição de páginas e posts: Você pode definir que a página inicial de seu site seja uma página estática e uma página qualquer seja sua página de blog (postagens) em configurações > leitura > Sua página inicial mostra > (página inicial, página de posts);
    neste caso a página de blogs será um sumário de seu site
  • Configurando página de blog personalizada: Quando você define que uma página será seu blog, todas as postagens existentes serão exibidas nela.
  • Imagem destacada: essa opção na sua página do WP, serve para que ela apareça como cabeçalho de uma página de Blogs (sumário).
  • Se você precisar editar uma página do seu WordPress fora do editor do WP e seu WP parou de funcionar lembre-se de que oWP foi criado num país de língua inglesa, e seu editor de código (bloco de notas de seu O.S, Dreamweaver, Notepad++, ete) pode estar salvando os arquivos editados com codificação UTF-8 (que considera caracteres latinos, que o WP não vai reconhecer).
    Por exemplo, as aspas ou crases em codificação ANSI podem parecer iguais a primeira vista, mas são códigos diferentes em UTF e ANSI (que o WP utiliza).
    Salve os arquivos editados de sweu WP em formato ANSI, nativo do WP.
    Texto relacionado: Tabela de caracteres em HTML.
    Essa dica também vale para usuários de Mac > Resolveno problemas com caracteres no MAC > Texto com caracteres trocados ou que é salvo errado

Tutoriais WP

Habilitar/desabilitar exibir/ocultar comentários

Link do site de suporte oficial do WordPress (em inglês);

Inserir imagem em widget da barra lateral/sidebar

Primeiro pesquise na internet se já não criaram um plug-in/widget para WordPress que faça isso.

Se ainda não o criaram, verifique se o seu modelo ou versão do WP suporta widget de imagem ou de texto na barra lateral de seu WP. Se esse widget não vier com sua versão (ou modelo) de WP, existem alguns plugins para esse fim.
Neste caso, você tem de inserir sua imagem como entidade/marcação de HTML; veja esse tutorial do Fórum WordPress e do Dicas de WordPress sobre como fazer.

Refazer login e senha perdidos no WP

Isso já me aconteceu e não foi nada engraçado usar de tentativa-e-erro para descobrir o e-mail de cadastro.
Para fazer o que digo no título acima você tem de ter acesso a administração da hospedagem de seu site (sem isso, nada feito). Conseguido isso, siga os passos descritos nesse link do Superdominios.org.

Como corrigir ajuste de data e hora a ser exibido no WP e plugins

Acesse na administração de seu WP: Settings/Configurações > Timezone (para definir diferença de fuso horário entre hora do servidor de hospedagem e a sua hora local), Data Format/Formato de data, Time format/formato de hora (para definir formato em “dia/mês/ano” e “12:00 ou 24:00″).

Como usar o WordPress

Uma vez instalado e configurado o WordPress (WP) na internet
(p.ex., em
http://www.seusite.com
ou
http://www.seusite.com/pasta do wordpress])
você pode começar a postar artigos ou notícias nele.

  • Acesse a administração de seu WP:

P.ex.:
http://www.seusite.com/wp-admin
ou
http://www.seusite.com/pasta do wordpress]/wp-admin

e digite seu nome de usuário e senha, cadastrados na instalação.

Na tela inicial, há uma barra de menus, com diversas opções de navegação, entre elas, artigos (ou posts)

wp-admin-inicio

Uma vez salvo e publicado o seu post, para vê-lo você pode
a) abrir outra janela do navegador e digitar o endereço de seu site/blog em wp (http://www.seunome.com ou http://www.seunome.com/pasta wordpress])
ou
b) ir no topo da página  e clicar no nome de seu site/blog ->ver artigo/página/o site

wp-ver-post

Enquanto estiver dentro do WordPress a barra escura no topo da tela ficará visível, para você poder voltar a administração do WordPress (p.ex., clique em Editar artigo/post/site).

wp-visualizar-post

Ao terminar de postar, não esqueça de fechar o WordPress, indo no topo direito da tela (seu nome de administrador > terminar sessão).

wp-encerrar

Você voltou a tela de entrada (administração) do WordPress, onde há um link direto para acessar o seu site/blog.

Outros links relacionados:
Atalhos de teclado no WordPress
Publicando no WordPress com MS Word
Usuários WP: papéis e capacidades (privilégios)

 Copiando postagem do WordPress com Plug-In Duplicate Post

Instalando o plug-in Duplicate Post você agiliza o processo de criação de novas postagens, de modo quase tão simples quanto como no WordPress.com

Seguem duas telas que ilustram visualmente o processo de duplicar um post, após instalação do plug-in:

(clique para ver ampliado)

copiar-post-wordpress-1

copiar-post-wordpress-4

Configurando permissões de comentários no WordPress

O wordpres tem uma boa base de video/tutoriais sobre como utilizá-lo mas posto aqui onde configura permissões de comentários em seu blog. Partindo do pressuposto que você já criou seu cadastro no WP e já tem um blog criado, basta seguir as informações visuais na imagem abaixo:

Dicas e links úteis sobre Joomla

Tutoriais sobre joomla

Joomla para iniciantes (site Numa Boa)
Organização do conteúdo no Joomla (artigos-djumla.blogspot)
Wiki oficial Joomla (Docs.Joomla.org)
Portal Joomla RJ

Tradução do Joomla para português: como fazer e download

Joomla template builder Ferramenta – paga – para facilitar a construção de modelos para Joomla

1 comentário (+adicionar seu?)

  1. Trackback: Tutoriais Web 3.0 » Traduzindo o WordPress

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

Seguir

Obtenha todo post novo entregue na sua caixa de entrada.

%d blogueiros gostam disto: