Mais...
05 mai
{ 15 dias atrás }

Utilizando Template Personalizado do Nextgen

Ola pessoal,

vamos aprender um pouco sobre template personalizado do nextgen gallery,  com ele você consegue desenvolver a galeria que quiser mas para você dominar sua galeria é preciso um conhecimento em php, não precisa ser o exper no assunto mas saber utilizar o basico para que possa obedecer a logica de cada projeto que vai ser desenvouvido,  nesse post vamos desenvolver um carousel alimentado pelo nextgen pegando todas images dos albuns ou galeria criada.

Topicos

01 – Primeiro vamos baixar nosso tema ja com os scripts do nosso carousel clique aqui

02 – pegue esse tema e coloque no diretorio themas do wordpress acesse o wp-admin -> aparencia e ative o nosso tema feito isso nosso tema foi instalado

03 – agora vamos preparar nosso template do nextgen gallery vamos criar um arquivo chamado gallery-tutorial.php salva no diretorio wp-content – > plugins -> nextgen-gallery -> view

04 – Inserir o codigo abaixo no nosso arquivo gallery-tutorial.php, esse codigo ja esta com os loop necessarios para chamar nossas imagens do nextgen esse html é o mesmo utilizado na nossa index.php do tema repare as funções

<?php
/**
Template personalizado desenvolvido por daviwp
post do site http://daviwp.com
**/
?>
 <ul id="mycarousel" class="jcarousel-skin-tango">
    <?php foreach ( $images as $image ) : ?>
        <li>
        <a href="<?php echo $image->imageURL ?>" title="<?php echo $image->description ?>" <?php echo $image->thumbcode ?> >
	<?php if ( !$image->hidden ) { ?>
	<img title="<?php echo $image->alttext ?>" alt="<?php echo $image->alttext ?>" src="<?php echo $image->thumbnailURL ?>" <?php echo $image->size ?> />
	<?php } ?>
	</a>
        </li>
    <?php endforeach; ?>    
    </ul>

05 – Agora abra nossa index.php remova a ul id mycarousel da linha 29 a 39 do nosso thema

06 – com a nossa index.php aberta onde foi removido ficou assim div wrap e div galeria ok? dentro da div galeria inseri o codigo abaixo nosso shortcode chamando nosso template gallery-tutorial.php prev explicação nossa galeria é randomica vai exibir um maximo de 20 images utilizando o template tutorial dessa forma qualquer galeria ou album ele vai pegar as img recentes

  <?php echo do_shortcode('[random max=20 template=tutorial]'); ?>

Bom galera esse post foi a pedido do Ramon Oliveira espero que todos gostem, vou dar uma explicação geral do nosso codigo utilizado o que fizemos foi peguei um script jquery carousel criei um tema basico utilizando ele peguei a ul principal do html inserir no template personalizado do nextgen depois inserir o shortcode chamando o template na index.php o template personalizado fiz um loop encima da tag li dizendo quando tiver img ele sempre repetir mas obedecendo o nosso parametro dentro do shortcode max=20 que exibe 20 imagens quantas imagens quiser so almentar ou diminuir.

Baixar o thema

Abraço a todo até aproxima.

Desenvolvedor web - Wordpress developer | Davi Santos
27 abr
{ 23 dias atrás }

Novo modelo de Hierarquia do wordpress

O diagrama a seguir mostra quais arquivos de modelo são chamados para gerar uma página do WordPress com base na hierarquia Template WordPress.

Desenvolvedor web - Wordpress developer | Davi Santos
12 abr
{ 38 dias atrás }

Fotos da Campus Party 2012 em São Paulo

Evento Campus Party 2012 em São Paulo foi muito bom estive com o brother Mateus Neves aconcelho a todos muita coisa legal ano que vem estamos de volta com mais galera da Quartel Design


Desenvolvedor web - Wordpress developer | Davi Santos
09 abr
{ 41 dias atrás }

Limite de Caracteres no WordPress

Olá pessoal estou aqui com mais um post básico mas útil, bom o que vamos fazer hoje é limitar nosso conteúdo utilizado excerpt.
O excerpt é padrão do wordpress mas as vezes não atende algumas necessidades como limitar menos de 20 caracteres pra isso segue um simples tutor ai
vamos lá?

- Topico

01 – Insira esse codigo no seu arquivo functions.php

// Limite de caracteres
function excerpt($limit) {
$excerpt = explode(' ', get_the_excerpt(), $limit);
if (count($excerpt)>=$limit) {
array_pop($excerpt);
$excerpt = implode(" ",$excerpt).'...';
} else {
$excerpt = implode(" ",$excerpt);
}
$excerpt = preg_replace('`\[[^\]]*\]`','',$excerpt);
return $excerpt;
}

02 – Agora so chama onde deseja limita

<?php echo excerpt('20'); ?>

Espero ajudar forte abraço até a proxíma

Desenvolvedor web - Wordpress developer | Davi Santos
27 mar
{ 55 dias atrás }

Como limitar titulo do seu post

Olá galera resouvi compartilhar esse código com a galera pois é muito util bom esse código limita qualquer titulo de um post de forma fácil e simples segue o código

1- inseri esse código no seu arquivo functions.php

<?php
function title_excerpt($maxchars) {
    $title = get_the_title($post->ID);
    $title = substr($title,0,$maxchars);
    echo $title;
}
?>

2- Depois de inserir o código no functions no lugar do você vai utilizar o

<?php title_excerpt(32); ?>

É isso ai galera espero que goste e compartilhe até a proxíma

Desenvolvedor web - Wordpress developer | Davi Santos
25 mar
{ 56 dias atrás }

Criando Custom Post Types de Video

Olá galera de volta com mais um post vamos aprender como criar um custom post type de video para wordpress
é bem simples só vamos precisar de um pouco de atenção vamos lá,

Tópicos

1- abra o arquivo functions.php dentro dele você vai inseri o seguinte código

$child_theme_path = pathinfo(__FILE__);
$functions_path = $child_theme_path["dirname"].'/functions/';
// Custom Post Types
require_once($functions_path . 'custom-post-types.php');

2- depois de inseri o código acima vamos criar um arquivo php com nome de custom-post-types.php

3- inseri o código abaixo dentro do arquivo custom-post-types.php

<?php
/* Post Type Videos */
add_action('init', 'videos_register');
function videos_register() {
     $labels = array(
            'name' => _x('V&iacute;deos Home', 'post type general name'),
            'singular_name' => _x('Not&iacute;cia', 'post type singular name'),
            'add_new' => _x('Adicionar novo v&iacute;deo', 'Post'),
            'add_new_item' => __('Adicionar novo v&iacute;deo'),
            'edit_item' => __('Editar post'),
            'new_item' => __('Novo post'),
            'view_item' => __('Ver post'),
            'search_items' => __('Procurar post'),
            'not_found' =>  __('Nada encontrado'),
            'not_found_in_trash' => __('Nenhum v&iacute;deo encontrado no lixo'),
            'parent_item_colon' => ''
    );
    $args = array(
            'labels' => $labels,
            'public' => true,
            'publicly_queryable' => true,
            'show_ui' => true,
            'query_var' => true,
            'capability_type' => 'post',
            'hierarchical' => true,
            'has_archive' => true,
            'menu_position' => 4,
            'rewrite' => array('slug' => 'videos')
      );
    register_post_type('videos',$args);
}

3- depois de ter criado nosso arquivo, vamos salvar dentro da pasta functions

4- pronto nosso custom esta criado, para testar inseri esse codigo abaixo no seu tema (Exemplo home)

    <?php $args = array( 'post_type' => 'videos', 'posts_per_page' => 5 );
                        $loop = new WP_Query( $args );
                        while ( $loop->have_posts() ) : $loop->the_post();
                        echo '<div class="entry-content_video_home">';
                        the_content();
                        echo '</div>';
                        endwhile;
                        ?>

5- Depois do nosso custom criado acesse seu painel wordpress repare uma aba vídeos home foi criado abixo do custom post, para inserir um video é simples basta escolher a opção adicionar novo dar um título e inserir um link do youtube dentro do textarea como se estivesse criando um post simples assim

Desenvolvedor web - Wordpress developer | Davi Santos
25 jul
{ 300 dias atrás }

Instalando jquery

Neste tutorial, vamos aprender “como instalar o Jquery em 2 etapas fáceis”.

Download jquery de jquery.com e salvá-lo em nosso sistema, juntamente com os outros arquivos
Vinculá-lo diretamente via ajax.googleapis.com
Como sempre instalá-lo usando os dois lados têm suas próprias vantagens e desvantagens. É um debate separado todos juntos. Mas ambos funcionam da mesma forma.

PRIMEIRO PASSO
Jquery download de www.jquery.com

Ir para www.jquery.com e na home page você pode ver um botão exibido ”jquery Download”
mas apenas antes de clicar no download não esqueça de selecionar o nível de compressão direita.

Selecione a versão de produção

e clique em download. É isso aí.

Salve o arquivo em uma pasta separada dentro JS seu site o jquery-1.4.4.min.js.

Você acabou de completar uma parte importante de instalação de jquery no seu website.

PASSO 2
Adicionando jquery para suas páginas

Abra sua página e entre os <head> </ head> tag, adicione o caminho para o arquivo jquery que acabou de baixar.

Exemplo abaixo

Installing Jquery<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>

É isso aí. agora você esta pronto para adicionar bonita animações, validações e efeitos.

Mas espere, há uma outra forma, você pode adicionar jquery para seu site, mas agora em vez de baixar diretamente do site da jquery. vamos buscar jquery de um determinado servidor hospedado em outro lugar remotamente. como code.google.com

Isto é como você poderia fazê-lo.

Installing Jquery<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>

Então é isso galera espero poder ajudar e tirar a a duvida de muitos que estão iniciando um forte abraço e até a próxima.

Desenvolvedor web - Wordpress developer | Davi Santos
05 jul
{ 320 dias atrás }

Funcionalidade do html 5

Olá pessoal,

Esse conteúdo mostra já algumas funcionalidade do html 5 rodando nos principais navegadores como IE Mozilla chrome, safari, opera, e outro confira abaixo os links dessas funções

Dois vídeos jogando em sincronia

Interatividade com gradientes de lona

Vídeos sincronizados lado a lado

Video executando normal

Carregando html 5

Mapa google sem flash

Formulário muito bacana

Arrastar para lixeira

Arrastando o link e soltando no quadro

 

Desenvolvedor web - Wordpress developer | Davi Santos
02 jul
{ 323 dias atrás }

Arquivos edição

Há momentos em que você terá que editar os arquivos do WordPress, especialmente se você quiser fazer mudanças em seu tema WordPress . WordPress possui um editor integrado para edição de arquivos de dentro do seu navegador, enquanto on-line: O Editor de Tema . Você também pode editar arquivos copiados ou armazenados em seu computador e depois enviá-los para seu site usando um cliente FTP .

Antes de editar qualquer um dos seus arquivos de WordPress, verifique o seguinte:

BACKUP! E Trabalho de Backups
Trabalhar a partir de cópias de arquivos de backup, quando possível e / ou certificar-se de que você backup de suas informações freqüentemente como você trabalha e fazer alterações. Manter backups em um local seguro.
Permissões de Arquivos
Quando estiver trabalhando online, você precisa configurar as permissões de arquivo adequadas para modificar e salvá-los. Se você vê uma nota na parte inferior do WordPress Built-in Editor de painel que diz “Se este arquivo foi gravável você poderia editá-lo.” , isso significa que você precisa alterar as permissões do arquivo antes de fazer quaisquer alterações.
Use um editor de texto para editar arquivos
Para fazer alterações em arquivos fora do built-in Plugin ou Theme Editor, use um editor de texto. NÃO USE um processador de texto. alterar processadores de texto as aspas para personagens e pode converter outros personagens ou trazer no código indesejado; essas mudanças fará com que o arquivo de quebrar. Existem também alguns programas gerador de HTML que não devem ser utilizados por razões semelhantes.

Usando o Editor de temas e Editor Plugin

WordPress contém dois built-in editores que lhe permite editar arquivos do tema diretamente no seu browser. Eles são chamados de Theme Editor e Editor do Plugin .

Acesse o Editor de temas da Administração > Aparência > Editor de menu.

O Editor Plugin está localizada na Administração > Plugins > editor .

Para visualizar um arquivo nestes editores, clique sobre o arquivo da lista do lado esquerdo.

Mais informações sobre temas edição está disponível no desenvolvimento do tema e usando temas .. Você pode saber mais sobre a edição de plugins em Escrevendo um Plugin e Recursos Plugin .

O que arquivos podem ser editados?

De dentro do WordPress Built-in Editor, seguintes tipos de arquivo podem ser editadas, se gravável :

  • HTML
  • PHP
  • CSS
  • . Htaccess
  • TXT (e relacionadas texto como arquivos, tais como RTF)

Coisas Que Você Precisa Saber

PESQUISA
Não há nenhuma. Não há qualquer REPLACE quer. Você apenas tem que percorrer o arquivo para encontrar o que você está procurando. Alternativamente, você pode usar um editor externo. Não existem números de linha também, então se você estiver usando o Firebug para jogar com o seu layout, você só tem que adivinhar o que você está na linha no Editor de temas.
Permissões de Arquivos
Para editar um arquivo através do Built-in Editor, as permissões para esse arquivo deve ser definido para 666. Você pode alterar as permissões em arquivos usando um programa cliente FTP , web-based interface fornecida pelo seu anfitrião, ou a partir da linha de comando usando telnet ou ssh (secure shell). Estas opções dependem do tipo de acesso o seu host oferece.
Alterações instantânea
As alterações feitas nos editores WordPress são instantâneas e você não precisa de um programa de cliente FTP. Você está mudando os arquivos online. Você e os visitantes poderão ver as mudanças imediatamente.
Cometer um erro? Use os arquivos de backup
Backup de todos os arquivos antes de editar. Se você cometer um erro, copie o arquivo de volta para o seu site a partir dos arquivos de backup. Sem backup? Você vai precisar baixar o WordPress, o seu tema, e arquivos que você precisa substituir e começar de novo. BACKUP FIRST.
Faça um erro ainda maior? Excluir
Se as mudanças que você faz com que seu site para “crash” ou dá-lhe uma tela em branco ou tela cheia de erros, se você não pode acessar o seu Painel de Administração, delete o arquivo alterado e substituí-lo com um bom a partir do seu backup.

Arquivos de edição off-line

Para editar arquivos offline, você deve pode usar qualquer um dos editores de texto recomendado para criar e editar arquivos e um cliente de FTP para carregá-las. Certifique-se de ver os resultados no seu navegador para verificar se a mudança desejada se tornar efectiva.

Nota: Não é recomendado alterar os arquivos de núcleo WordPress que não wp-config.php . Se você precisar alterar qualquer outra coisa, tomar notas e armazená-los em um arquivo de texto no diretório raiz do WordPress e fazer uma cópia de backup deles para referência futura e upgrades.

Usando editores de texto

Editores a evitar

Se você usar qualquer editor externo que não é um editor de texto somente, como software de processamento de texto padrão, ele pode corromper o arquivo que você está editando .

Editores para evitar o uso para criar e editar arquivos incluem:

  • Microsoft Word
  • WordPerfect
  • OpenOffice
  • Páginas da Apple iWork
  • Microsoft Publisher
  • Microsoft Works
  • Microsoft Excel
  • Adobe Photoshop
  • Adobe Illustrator
  • Adobe Dreamweaver
  • Qualquer do-it-yourself software instantâneas página web.

Se você deve usar o Adobe Dreamweaver ou Microsoft FrontPage , manter essas diretrizes em mente:

  • Adobe Dreamweaver: Para certificar-se de seus arquivos de trabalho corretamente, copiar o conteúdo do editor WordPress e substituir o Dreamweaver coloca em novos arquivos por padrão.
  • Microsoft FrontPage: Seja vigilante de código extra inserido pelo FrontPage, e não tente usar a sua built-in templates. Além disso, prestar atenção para Internet Explorer código específico, pois pode tornar seu site ou agir de forma inesperada em determinados navegadores, que devem ser evitados.

Editores aceitável

A Seção Editor de Texto do Glossário recomenda os editores seguintes:

  • BBEdit
  • Boxer Text Editor
  • Coda
  • Crimson Editor
  • EditPad
  • EditPlus
  • Editra
  • emacs
  • Fraise
  • gedit
  • JEdit
  • Kate
  • Komodo Edit
  • Kwrite
  • Notepad + +
  • phpDesigner
  • pico
  • PSPad
  • Smultron
  • SubEthaEdit
  • TextEdit
  • TextMate
  • TextPad
  • TextWrangler
  • UltraEdit-32
  • vim
  • Notepad2 (Windows, Freeware)
  • Editor de Webtide.
Desenvolvedor web - Wordpress developer | Davi Santos
01 jul
{ 324 dias atrás }

Deixe seu tema interativo ( JQuery )

Algumas da funções JQuery que gosto de utilizar em meus temas wordpress

1. Tabs

2. Tooltips

3. Overlay

4. Scrollable

Desenvolvedor web - Wordpress developer | Davi Santos