Advertisement
  1. Code
  2. WordPress

Adicionando Data de Expiração Para Posts do WordPress

Scroll to top
Read Time: 9 min

Portuguese (Português) translation by João Fagner (you can also view the original English article)

Eu administro alguns sites que incluem avisos e informações importantes em um banner em sua página inicial. Eu tendo a usar um tipo de post personalizado para isto, adicionando meus banners e exibindo eles aonde eu preciso no tema. (Se você quiser fazer algo semelhante é explicado neste tutorial.)

Mas invariavelmente meus banners não possuem uma data de expiração. Eles podem conter informações sobre os próximos eventos ou sobre uma vaga, por exemplo. Uma vez que o evento tenha passado ou a vaga já tenha sido preenchida, tenho que ir no site manualmente e enviar o post para o lixo.

Seria bem mais fácil se ao criar este tipo de posts eu pudesse configurar uma data de termino e depois da data expirada eles já não estariam visíveis no meu site.

Neste tutorial mostrarei como fazer exatamente isso. Existem três etapas:

  1. Cria uma meta box (caixa de meta) na tela de edição do post para a data de expiração.
  2. Aplicar o  jQuery UI datepicker para o campo da meta box (caixa de meta) para melhorar a interface.
  3. Finalmente, usar o gancho de pre_get_posts para garantir que não são serão exibidas os posts após sua data de expiração.

O Que Você Precisará

Para concluir este tutorial, que você vai precisar:

  • uma instalação de desenvolvimento do WordPress
  • um editor de código

Você irar criar um plugin com todo o código necessário para a data de expiração e ativá-lo no seu site. Então vamos começar!

Configurando o Plugin

Primeiro você precisa criar seu plugin. Na pasta de plugins em seu diretório wp-content, crie um arquivo vazio chamado tutsplus-post-expiry-date-php.

Abra o arquivo no seu editor de código e adicione o seguinte:

1
<?php
2
/*

3
Plugin Name: Add an Expiry Date to Posts

4
Plugin URI: https://.tutsplus.com/tutorials/add-an-expiry-date-to-wordpress-posts--cms-22665

5
Description: Adds an expiry date to posts, using a the jQuery UI datepicker

6
Author: Rachel McCollin

7
Version: 1.0

8
 */

Você precisará editar o arquivo para usar seu próprio nome e plugin URL, mas isto é o que você precisará para dizer o WordPress que este é um plugin e que ele faz.

Agora vá para a sua tela de Plugins no Admin do WordPress e o ative.

Criando a Meta Box (Caixa de Meta)

Primeiro vamos criar meta box para a data de expiração.

Usando add_meta_box() Para Exibir a Meta Box (Caixa de Meta)

O primeiro passo é criar a função que irá adicionar a meta box na tela de edição do post. Adicione isto ao seu arquivo de plugin:

1
function tutsplus_add_expiry_date_metabox() {
2
    add_meta_box( 
3
        'tutsplus_expiry_date_metabox', 
4
        __( 'Expiry Date', 'tutsplus'), 
5
        'tutsplus_expiry_date_metabox_callback', 
6
        'post', 
7
        'side', 
8
        'high' 
9
    );
10
}
11
add_action( 'add_meta_boxes', 'tutsplus_add_expiry_date_metabox' );

Use a função add_meta_box() que tem seis parâmetros:

  • 'tutsplus_expiry_date_metabox':  ID único da meta box
  • __( 'Expiry Date', 'tutsplus'): Exibe o título da meta box
  • 'tu'tutsplus_expiry_date_metabox_callback': a função de retorno que preencherá a meta box que (criaremos na próxima etapa)
  • 'post': o tipo de post em que a meta box irá aparecer na área de edição
  • 'side': área em que a meta box aparecerá na tela
  • 'high': o posicionamento em que a meta box irá aparecer no post

A função então é anexada ao gancho add_meta_boxes para fazê-lo iniciar na hora certa.

Criando a Função de Retorno da Chamada (Callback)

Se você salvar seu plugin e carregar sua tela de edição agora, você verá um erro porque a função de retorno de chamada ainda não foi definida. Então nós vamos fazer isso a seguir.

Adicione isto ao seu arquivo de plugin:

1
function tutsplus_expiry_date_metabox_callback( $post ) { ?>
2
    
3
  <form action="" method="post">
4
		
5
		<?php 		
6
		//retrieve metadata value if it exists

7
		$tutsplus_expiry_date = get_post_meta( $post->ID, 'expires', true );
8
		?>
9
		
10
		<label for "tutsplus_expiry_date"><?php __('Expiry Date', 'tutsplus' ); ?></label>
11
				
12
		<input type="text" class="MyDate" name="tutsplus_expiry_date" value=<?php echo esc_attr( $tutsplus_expiry_date ); ?> / >			
13
	
14
	</form>
15
	
16
<?php }

Vamos examinar o que isto significa:

  • Ele define a função de retorno tutsplus_expiry_date_metabox_callback() com $post como seu objeto.
  • Abre-se um elemento de formulário.
  • Cria uma variável chamada $tutsplus_expiry_date com o valor da chave meta 'expires' como seu valor.
  • Ele cria uma label (rótulo) para o campo na meta box.
  • Cria um elemento com a classe MyDate necessária para o datepicker funcionar, o nome tutsplus_expiry_date que usaremos mais tarde quando salvar os dados do campo e o valor de $tutsplus_expiry_date.
  • Fecha se o formulário.

Então agora temos o formulário, mas na verdade ele não faze nada a não ser que criemos outra função para salvar os dados que o usuário adicionará a ele.

Salvando Dados Quando o Post Salvar

Para salvar qualquer dados de entrada no formulário nós precisamos criar uma função e em seguida anexar isso ao gancho save_post.

No seu arquivo de plugin, adicione isto:

1
function tutsplus_save_expiry_date_meta( $post_id ) {
2
    
3
	// Check if the current user has permission to edit the post. */

4
	if ( !current_user_can( 'edit_post', $post->ID ) )
5
    return;
6
	
7
	if ( isset( $_POST['tutsplus_expiry_date'] ) ) {		
8
		$new_expiry_date = ( $_POST['tutsplus_expiry_date'] );
9
		update_post_meta( $post_id, 'expires', $new_expiry_date );		
10
	}
11
	
12
}
13
add_action( 'save_post', 'tutsplus_save_expiry_date_meta' );

Isto faz o seguinte:

  • Ele verifica se o usuário atual tem a permissão de editar o post atual edit_post.
  • Se sim, ele verifica se dados foram adicionados ao campo de meta box usando isset.
  • Se esse for o caso, ele criará uma variável chamada $new_expiry_date e define como o valor que é sido entrado.
  • Finalmente, ele atualizará os metadados do post com esse valor.

Então, teremos uma meta box que permitirá aos usuários adicionar texto e salvá-lo como metadados do post. Agora, vamos fazer isso ficar mais seguro.

Adicionando um Nonce Para Segurança

Para garantir que os metadados do post serão editado apenas através deste formulário adicionaremos um nonce.

Na função de retorno antes do resto do conteúdo da função adicione o seguinte código:

1
wp_nonce_field( 'tutsplus_expiry_date_metabox_nonce', 'tutsplus_nonce' );

Em seguida, na função tutsplus_save_expiry_date_meta() que salva os dados, adicione isso no início da função:

1
if( !isset( $_POST['tutsplus_nonce'] ) ||
2
    !wp_verify_nonce( $_POST['tutsplus_nonce'],
3
	'tutsplus_expiry_date_metabox_nonce'
4
	) ) 
5
return;

Agora salve seu plugin e dê uma olhada na sua tela de edição do post. Você verá sua meta box:

Edit Post screen with meta box addedEdit Post screen with meta box addedEdit Post screen with meta box added

Este foi um bom começo, mas o problema é que no momento este é um campo de texto normal então não há nenhuma maneira de garantir que seus usuários digitarão apenas datas e no formato correto. Nós vamos corrigir isso adicionando jQuery UI datepicker.

Adicionando o JQuery UI Datepicker

A grande notícia é que o jQuery UI datepicker vem pré-carregado com o WordPress, então não precisa registrar ou instalá-lo: você apenas enfilera em uma função.

Na parte superior do seu arquivo de plugin adicione isto:

1
function tutsplus_load_jquery_datepicker() {    
2
	wp_enqueue_script( 'jquery-ui-datepicker' );
3
	wp_enqueue_style( 'jquery-style', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css' );
4
}
5
add_action( 'admin_enqueue_scripts', 'tutsplus_load_jquery_datepicker' );

Isto enfileira ambos os scripts em si e a folha de estilo para o script que é armazenado na APIs do Google. Observe que você deve ligá-lo ao gancho de ação admin_enqueue_scripts e não wp_enqueue_scripts como você faria se você estivesse usando o script no front end.

Em seguida, você precisará adicionar um script para a função de retorno que exibirá o seu formulário. Após o elemento de entrada e antes do fechamento da tag </form> adicione isto:

1
<script type="text/javascript">
2
    jQuery(document).ready(function() {
3
		jQuery('.MyDate').datepicker({
4
			dateFormat : 'dd-mm-yy'
5
		});
6
	});
7
</script>			

Isso faz referência à classe MyDate que você já adicionou ao elemento de entrada e adiciona também o script datepicker.

Agora, sua função de retorno de chamada ficará assim:

1
function tutsplus_expiry_date_metabox_callback( $post ) { ?>
2
    
3
	<form action="" method="post">
4
		
5
		<?php 		
6
		// add nonce for security

7
		wp_nonce_field( 'tutsplus_expiry_date_metabox_nonce', 'tutsplus_nonce' );
8
		
9
		//retrieve metadata value if it exists

10
		$tutsplus_expiry_date = get_post_meta( $post->ID, 'expires', true );
11
		?>
12
		
13
		<label for "tutsplus_expiry_date"><?php __('Expiry Date', 'tutsplus' ); ?></label>
14
				
15
		<input type="text" class="MyDate" name="tutsplus_expiry_date" value=<?php echo esc_attr( $tutsplus_expiry_date ); ?> / >
16
		
17
		<script type="text/javascript">
18
			jQuery(document).ready(function() {
19
				jQuery('.MyDate').datepicker({
20
					dateFormat : 'dd-mm-yy'
21
				});
22
			});
23
		</script>			
24
	
25
	</form>
26
	
27
<?php }

Agora vamos dar uma olhada como a meta box parece após eu salvar meu arquivo de plugin:

Meta box with datepicker addedMeta box with datepicker addedMeta box with datepicker added

Isso é muito mais legal! Agora, você pode adicionar uma data de expiração para seus posts, no momento não fará nenhuma diferença se serão exibidos ou não no seu site. Então, vamos mudar isso agora.

Alterando a Consulta Para Excluir os Posts Expirados

A etapa final é alterar a consulta principal usando o gancho de pre_get_posts.

Ainda trabalhando no seu arquivo de plugin, adicione este código:

1
function tutsplus_filter_expired_posts( $query ) {
2
    
3
    // doesn't affect admin screens

4
    if ( is_admin() )
5
        return;
6
    // check for main query	

7
	if ( $query->is_main_query() ) {
8
9
    	//filter out expired posts

10
        $today = date('d-m-Y');
11
        $metaquery = array(
12
            array(
13
                 'key' => 'expires',
14
                 'value' => $today,
15
                 'type' => 'DATE',
16
                 'compare' => '<'
17
			)
18
        );
19
        $query->set( 'meta_query', $metaquery );
20
	}
21
}
22
add_action( 'pre_get_posts', 'tutsplus_filter_expired_posts' );

Isto faz seis coisas:

  • Primeiro ele define a função tutsplus_filter_expired_posts() com $query como seu objeto.
  • Ele verifica se estamos na tela do admin, como não queremos excluir os posts expirados deles.
  • Em seguida, ele verifica se a consulta principal está sendo executada.
  • Se sim, ele define a variável $today como a data de hoje, utilizando a mesma data de formatação que o datepicker usa.
  • Em seguida, define $metaquery para excluir mensagens cujo prazo de validade é antes a data de hoje, usando o operador compare de comparação.
  • Finalmente, ele redefine a consulta usando a variável $metaquery.

A função está ligada ao pre_get_posts que irá executa-lo como uma consulta de busca de posts.

Agora salve seu arquivo do plugin e faça um teste. Crie um post com uma data de publicação de alguns dias atrás e então de-lhe uma data de expiração de ontem. Salve e mude para sua página principal do blog. Você perceberá que o post que você acabou de criar não está lá!

Resumo

Será capaz de definir automaticamente uma data de expiração para seus posts algo que é bem útil. Se o conteúdo de um post não for mais relevante, ou se as pessoas não poderem mais visualizar o post após uma determinada data, adicione uma data de expiração e agende a saída do post evitando ter que editar ou excluir o post futuramente, uma vez que não será mais necessário.

Usando o datepicker do jQuery, você criou uma meta box fácil de usar que pode ser usada para lhe poupar tempo e evitar confusão com os visitantes.

Seja o primeiro a saber sobre novas traduções–siga @tutsplus_pt no Twitter!

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.