Criando Meta Box para o seu tema WordPress

Você já precisou de um campo e não encontrou no WordPress? Teve que utilizar dos campos personalizados? Ou então instalou um plugin? É meu amigo, seus problemas acabaram, a solução é utilizar Meta Box.
Meta boxes são campos, que ficam no dashboard do WordPress, em posts, páginas e custom posts. De uma maneira mais amigável para o usuário. Meta boxes são altamente configuráveis, podem ser utilizadas para alterar a aparência, guardar informações, criar listas dinâmicas, galerias de imagens, em fim serve para atender a suas necessidades.
Diferente de usar plugins para adicionar, um Meta box, o seu código vai ficar mais limpo, pois você vai estar fazendo com que sua aplicações solucione apenas o necessários. Ficará confiável e ‘visível’ ao usuário, melhor que utilizar dos campos personalizados.
Bom então algo tão variável de utilizar, deve necessitar de um código monstruoso? Errado, para adicionar Meta box ao nosso tema, utilizamos de uma função nativa do WordPress, add_meta_box( ) . Vamos ver como funciona.
Imaginando que temos o seguinte problema, precisamos ter no nosso post, um campo para adicionar, uma cor ao título, mas cada post deve ter um título com uma cor diferente.
Vamos primeiro ver quais os parâmetros, nossa função add_meta_box recebe:

add_meta_box( $id, $title, $callback, $post_type, $context, $priority, $callback_args );
  • $id: Este é um ID único atribuído à sua caixa de meta. Ela deve ter um prefixo único e ser HTML válido. [String – Obrigatório]
  • $title: O título da caixa do meta box. [String – Obrigatório]
  • $callback: A função de retorno de chamada que exibe a saída da sua caixa de meta. Já vamos ver ela melhor. [String – Obrigatório]
  • $post_type: Onde será exibido o Meta Boxes. Exemplos (‘post’, ‘page’, ‘link’, ou ‘custom_post ).  [String ou Array – Opcional, por padrão fica null]
  • $contexto: Onde na página o Meta box deve ser mostrado. As opções disponíveis são  ‘normal’, ‘side’ e ‘advanced’. [String – Opcional, padrão ‘advanced’]
  • $priority:  Prioridade de inserção da caixa em relação as demais, opções ‘high’ ou ‘low’. [String]
  • $callback_args: Determina a passagem de parâmetros a função callback [Matriz – Opcional]

Depois de conhecer os parâmetros que nossa função recebe, podemos iniciar nossa aplicação. Vamos utilizar nosso arquivo ‘function.php’, nele vamos iniciar criando uma função.

add_action( 'add_meta_boxes', 'init_meta_box_color' );
function init_meta_box_color(){
}

Está função servirá como uma chamada para nosso Meta box, conhecida no WordPress como ‘actions’. Pois não podemos sair criando Meta box a qualquer momento, precisamos respeitar a ordem do WordPress, por isso vamos utilizar essa função de chamada.

add_action( 'add_meta_boxes', 'init_meta_box_color' );
function init_meta_box_color(){
    add_meta_box( $id, $title, $callback, $post_type, $context, $priority, $callback_args );
}

Agora sim podemos adicionar o nosso Meta box, vamos ajustar os parâmetros conforme nossa necessidade.

add_action( 'add_meta_boxes', 'init_meta_box_color' );
function init_meta_box_color(){
    add_meta_box( 'id_meta_color', 'Escolha uma cor para o título', 'meta_color', 'post', , 'normal', null );
}

O Meta box já foi criado, e está em exibição no nosso tema, agora vamos colocar um conteúdo para ele. Vamos criar uma função, com o nome que colocamos no parâmetro de callback, que no nosso caso foi ‘meta_color’.

function meta_color(){6
    ?>
    
    
    
    
    
    
    
    <?php
}
add_action( 'save_post', 'save_meta_color' );
function save_meta_color( $post_id  ){
    if(isset( $_POST['field_color'] ) ){
	   update_post_meta( $post_id , 'field_color', $_POST['field_color'] );
    }
}
READ MORE

CMKY x RGB x DPI

CMKY ou RGB?
RGB é a abreviatura das cores primarias em inglês, que são: Vermelho, Verde e Azul (Red, Green e Blue). Esse padrão foi constituído para reprodução através da luz, por isso é destinado para telas de computadores, celular e monitores. Estas cores combinadas resultam em outras cores. Em razão disto, o valor para modificar uma cor vai de 0 a 255. Para isso, a mistura das cores varia de acordo com a intensidade da mesclagem que você fez.
Já o CMKY, abreviatura das cores subtrativas formado por Ciano (Cyan), Magenta (Magenta), Amarelo (Yellow) e Preto (Black (Key)). Esse padrão, ao contrário do RGB, é composto por cor pigmento. Por isso, as cores em CMKY na tela dos monitores não são reproduzidas da mesma forma que impressa.
Afinal, quando usar CMKY ou RGB?
Como já colocado, CMKY é dedicado para a maioria das impressões gráficas, isto pode não ser considerado dependendo da máquina e o tipo de impressão que será realizada. Já o RGB usamos nas telas de computadores ou celulares.
Como configurar meu arquivo para CMKY ou RGB?
No Photoshop, antes de você iniciar um novo arquivo você já pode definir o padrão, quando você abrir um novo arquivo (CTRL+N). A caixa de definições é mostrada no Modo de Cores:

rgbxcmky

DPI?
Pontos por polegadas como é nomeado o DPI, é uma medida relacionada a composição da imagem, representando o número de pontos existentes em uma polegada. O Termo mais comum é resolução da imagem. Isto porque, a resolução está diretamente ligada à o número de DPIs, quanto maior, maior será a qualidade e definição da imagem. Para definir o número de DPI é preciso saber o que você pretende produzir, quanto maior a impressão ou a necessidade de qualidade, maior deverá ser o DPI.
18180948131508
Como defini-lo?
No Photoshop você define da mesma forma, na caixa inicial de abertura de um arquivo, terá a opção Resolução (conforme imagem)
resolucao
 
E o Pantone?
Pantone é uma tabela de cores primarias. A diferença das cores Pantone para o CMKY, por exemplo, é a exatidão nas cores que evitam variações na impressão. Geralmente muito usada em logos ou impressões que utilizam de poucas cores e que necessitam de uma impressão fiel ao arquivo.

READ MORE

Operador condicional (ternário): Como exatamente funciona?

O que significa isso: “isset($_POST[‘name’]) ? $_POST[‘name’] : ‘Convidado’;” ?
Muito conhecido por ser utilizado por programadores ‘preguiçosos’, que evitam criar um código monótono e redundante. O operador ternário é uma versão do “IF…ELSE”, que consiste em agrupar, na mesma linha, os comandos da condição.
Mas qual a diferença dele para o nosso  “IF…ELSE”?
Vamos comparar, primeiro a condição tradicional:

$sexo = 'M';
if($sexo == 'M'){
    $mensagem = 'Olá senhor';
}else{
    $mensagem = 'Olá senhora';
}

E agora como seria a nossa condição com operador ternário:

$sexo = 'M';
$mensagem = $sexo == 'M' ? 'Olá senhor' : 'Olá senhora' ;

Notamos que nosso código foi resumido de 6 linhas para apenas 2, a vantagem é bem clara, não é preciso repetir o nome da variável, pois o valor já é atribuído a ela.
OK, já vimos a comparação das condições, mas agora vamos entender como trabalhar com a estrutura do operador ternário.

$nota = 8;
$resultado = $nota > 7 ? 'Você Passou' : 'Você Reprovou' ;

Na condição o primeiro parâmetro recebe uma expressão booleana, o segundo é o retorno caso essa expressão seja verdadeira, e o último retorna o valor caso a expressão esteja errada. Assim a variável ‘resultado’ fica com o valor ‘Você Passou’.
O operador ternário vai facilitar muito sua vida, mas no caso de condições mais complexas, é aconselhado utilizar o tradicional IF…ELSE.

$cargo = $salario <= 1000 ? 'junior' : $salario <= 5000 ? 'senior' : 'diretor';

Ficou um pouco confuso, né? Então em casos complexos, ou de controle de fluxo, continue utilizando o IF…ELSE, mas quando for pra atribuir um valor a variável, use e abuse da condição ternánia.
Lembre-se, os exemplos dados acima foram feitos em PHP, condições ternárias, podem ser utilizados em outras linguagens, como Javascript.

validaEmail(email) ? enviaEmail(email) : mostraErro();
READ MORE