Imagens e outros arquivos de mídia são uma parte importante de qualquer site WordPress. Para usá-los eficazmente, ajuda a ter uma compreensão firme de como a biblioteca de mídia WordPress funciona.

Este prático recurso de WordPress permite que você armazene e gerencie suas imagens e outras mídias ao longo do tempo. Com algum conhecimento interno e alguns truques simples, há muito que você pode fazer para melhorar o seu site através da sua Biblioteca de Mídia.

Neste guia abrangente, nós o acompanharemos por tudo o que há para saber sobre a Biblioteca de Mídia WordPress, incluindo como importar e baixar conteúdo. Cobriremos também edição de imagens, gerenciamento de arquivos a longo prazo e quatro hacks para incorporação de funcionalidades avançadas.

Vamos começar!

Uma Introdução à Biblioteca de Mídia WordPress

Em sua essência, sua Biblioteca de Mídia WordPress é exatamente o que seu nome implica: um catálogo de todos os arquivos de mídia que você carregou no seu site:

Biblioteca de Mídia WordPress

Biblioteca de Mídia WordPress

O WordPress é capaz de hospedar uma variedade de tipos de mídia, inclusive:

Ele também tem alguns recursos limitados de edição de fotos, para que você possa fazer os ajustes necessários diretamente do seu painel.

Para acessar sua Biblioteca de Mídia, basta clicar em Mídia na barra lateral de sua administração a qualquer momento:

Acesso à Biblioteca de Mídia WordPress

Acesso à Biblioteca de Mídia WordPress

Há algumas opções básicas disponíveis aqui.

Primeiro, você pode determinar se deseja ver seus arquivos em uma visualização em lista ou grade, clicando nos ícones relevantes:

Opções de visualização da Biblioteca de Mídia WordPress

Opções de visualização da Biblioteca de Mídia WordPress

Você também pode filtrar seus arquivos usando os menus drop-down:

Filtragem de arquivos da Biblioteca de Mídia WordPress

Filtragem de arquivos da Biblioteca de Mídia WordPress

O primeiro menu permite que você veja sua mídia por tipo, enquanto o segundo irá filtrar o conteúdo de sua biblioteca pelas datas em que foram carregadas.

Você também pode usar a barra de busca para procurar por arquivos específicos pelo nome:

Barra de busca da Biblioteca de Mídia WordPress

Barra de busca da Biblioteca de Mídia WordPress

Finalmente, há também um botão Bulk Select. Este recurso permite apagar vários arquivos da sua instalação do WordPress de uma só vez:

Opção de seleção em massa na Biblioteca de Mídia WordPress

Opção de seleção em massa na Biblioteca de Mídia WordPress

Isto abrange todas as funcionalidades nativas disponíveis na tela da Biblioteca de Mídia WordPress.

Como você verá mais tarde, há muitas modificações que você pode fazer para melhorá-lo. Primeiro, porém, precisamos discutir como adicionar arquivos ao WordPress.

✨ Imagens são maneiras poderosas de vender e se envolver com seus usuários. Saiba tudo o que você precisa saber sobre a Biblioteca de Mídia WordPress 📸Click to Tweet

Como Adicionar Arquivos à sua Biblioteca de Mídia WordPress

Existem algumas maneiras diferentes de adicionar arquivos à sua Biblioteca de Mídia WordPress. A primeira é navegar para Mídia > Adicionar Novo:

Acesso ao Uploader do WordPress Media

Acesso ao Uploader do WordPress Media

Aqui, você pode carregar arquivos que são salvos no seu computador ou em outro dispositivo:

Carregador de Mídia WordPress

Carregador de Mídia WordPress

Você também pode adicionar mídia diretamente do editor do WordPress. No Block Editor, comece adicionando o bloco correspondente para o tipo de mídia que você deseja incorporar:

Blocos de mídia WordPress

Blocos de mídia WordPress

No local resultante, selecione Upload e escolha um arquivo do seu computador:

Upload de mídia do Block Editor

Upload de mídia do Block Editor

Alternativamente, você pode simplesmente arrastar e soltar o arquivo do seu desktop para o bloco relevante.

No Editor Clássico, você precisará clicar no botão Adicionar Mídia:

Classic Editor Botão Adicionar Mídia

Classic Editor Botão Adicionar Mídia

Depois navegue até a aba Upload e selecione um arquivo do seu computador:

Upload de mídia do Classic Editor

Upload de mídia do Classic Editor

Você também pode arrastar e soltar arquivos do seu desktop diretamente para o editor, a qualquer momento.

Em alguns casos, você pode achar que você precisa fazer upload manual arquivos de mídia para o seu site WordPress via FTP. Você pode fazer isso usando um cliente como o FileZilla.

Uma vez conectado ao seu servidor, navegue até wp-content > uploads:

Upload de arquivos para o diretório da Biblioteca de Mídia WordPress via FileZilla

Upload de arquivos para o diretório da Biblioteca de Mídia WordPress via FileZilla

Carregue arquivos neste diretório para adicioná-los à sua Biblioteca de Mídia.

Download de Conteúdo da Biblioteca de Mídia WordPress

Em algumas circunstâncias, você pode precisar baixar arquivos da sua Biblioteca de Mídia para o seu computador. O WordPress permite que você faça isso nativamente, navegando para Ferramentas > Exportar:

Ferramenta de exportação WordPress

Ferramenta de exportação WordPress

Em seguida, selecione a opção Mídia. Se você só precisa de arquivos que foram carregados dentro de um período de tempo específico, você pode usar os menus suspensos para especificar o seu pedido:

Exportando mídias WordPress

Exportando mídias WordPress

Finalmente, clique no botão Download Export File. Isto irá baixar os arquivos de mídia relevantes para o seu computador.

Como editar imagens na Biblioteca de Mídia WordPress

Como mencionamos anteriormente, o WordPress tem alguns recursos de edição de imagens nativas. Para acessá-las, navegue até sua Biblioteca de Mídia WordPress e selecione o arquivo que você deseja editar. Em seguida, clique no botão Editar imagem:

Botão Editar Imagem no WordPress

Botão Editar Imagem no WordPress

Isto irá abrir o editor de imagens:

Editor de imagens WordPress

Editor de imagens WordPress

Há cinco edições básicas que você pode fazer:

O corte permite o corte de seções da imagem:

Cultura de imagem em WordPress

Cultura de imagem em WordPress

Girando a imagem no sentido anti-horário ou no sentido horário em 90 graus:

Girar imagem à esquerda no WordPress

Girar imagem à esquerda no WordPress

Ao girar a imagem, ela será refletida vertical ou horizontalmente:

Imagem horizontal flip no WordPress

Imagem horizontal flip no WordPress

As outras três configurações estão na barra lateral. A primeira permite que você altere o tamanho da imagem através da escala da mesma. Basta digitar a altura ou largura desejada, e o outro campo irá se auto-popular. Em seguida, clique no botão Escala:

Dimensionando uma imagem no WordPress

Dimensionando uma imagem no WordPress

É importante notar que o redimensionamento de imagens no WordPress pode, às vezes, afetar negativamente sua qualidade.

Além disso, você só pode tirar imagens grandes e escalá-las para baixo. Você não pode escalar as imagens para um tamanho maior!

Para recortar sua imagem para que ela tenha uma relação de aspecto ou dimensões específicas, você pode usar os campos Aspect Ratio e Selection em Image Crop:

Configurando as dimensões de seleção de corte de imagem no WordPress

Configurando as dimensões de seleção de corte de imagem no WordPress

Finalmente, se você deseja preservar a miniatura da imagem existente, você pode fazer isso usando as Configurações de miniaturas. Basta selecionar o botão de rádio para qualquer versão da sua imagem que você deseja aplicar as alterações:

Configurações de miniaturas no editor de imagens do WordPress

Configurações de miniaturas no editor de imagens do WordPress

A edição de imagem padrão do WordPress é útil, mas limitada. Ele não substituirá nenhum software que você possa usar para modificações mais extensas, especialmente se você estiver rodando um site de fotografia ou photoblog.

Entendendo os erros da Biblioteca de Mídia WordPress

Infelizmente, ocorrem erros no WordPress. E a Biblioteca de Mídia do WordPress não é exceção.

Um problema que normalmente aparece é um “erro HTTP” não especificado que pode aparecer quando você está carregando um novo arquivo de dentro do editor:

Erro HTTP no upload de mídia

Erro HTTP no upload de mídia

Normalmente, você pode simplesmente esperar que esse erro desapareça e tentar o upload novamente após alguns minutos. Se o erro HTTP ocorrer novamente, pode ser que sua sessão do WordPress tenha expirado. Você precisará fazer o login novamente e depois tentar novamente o upload.

Outro problema que alguns usuários enfrentam é a falha de carregamento da Biblioteca de Mídia. Isto é muitas vezes devido a um conflito com seus plugins e/ou tema. Para solucionar este erro, tente desativar todos os seus plugins e mudar para um tema padrão do WordPress.

Se a sua Biblioteca de Mídia carregar corretamente novamente, você precisará solucionar o conflito de plugins para resolver o problema permanentemente.

Gerenciamento de Mídia de Longo Prazo

Até o momento, focamos exclusivamente na funcionalidade nativa do WordPress quando se trata da Biblioteca de Mídia. No entanto, como você usa este recurso ao longo do tempo, você provavelmente terá alguns problemas que requerem ajuda de soluções externas.

Por exemplo, quanto mais arquivos você adicionar, mais desorganizada será a sua Biblioteca de Mídia WordPress. Além das opções de busca e filtragem discutidas para o início deste post, o WordPress não oferece muita ajuda para lidar com volumes desordenados de mídia.

Existem, no entanto, alguns plugins que permitem que você organize seus arquivos de mídia em pastas.

O plugin WordPress Media Library Folders é a opção mais popular:

WordPress Media Library Folders WordPress plugin

WordPress Media Library Folders WordPress plugin

Além de permitir que você crie pastas de arquivos de mídia, este plugin também se integra ao MaxGalleria para permitir que você crie galerias de imagens diretamente da Biblioteca de Mídia:

WordPress Gallery MaxGalleria WordPress plugin

WordPress Gallery MaxGalleria WordPress plugin

A atualização para o WordPress Media Library Folders Pro oferece integração adicional com o plugin NextGEN Gallery e os Advanced Custom Fields. Ele também permite que você crie categorias e tags para organizar ainda mais seus arquivos.

Outra funcionalidade que falta no WordPress é a capacidade de substituir arquivos de mídia por novas versões. Como estes tipos de arquivos podem ser bastante grandes, você não quer simplesmente continuar adicionando novos arquivos sempre que precisar atualizar seu conteúdo.

Isso significa que após carregar um novo arquivo, você precisará localizar a versão antiga e excluí-la. Você pode economizar algum tempo substituindo diretamente imagens antigas por Enable Media Replace por ShortPixel:

Enable Media Replace WordPress plugin

Enable Media Replace WordPress plugin

Com este plugin, você também pode substituir todos os links que apontam para o arquivo antigo. Isto é útil para evitar mídia quebrada em todo o seu site.

4 Práticos Hacks para Biblioteca de Mídia WordPress

A Biblioteca de Mídia WordPress pode lidar com a maioria dos requisitos comuns de um administrador do site. No entanto, o WordPress fornece uma série de funções e hooks que permitem aos usuários aprimorar características específicas da Biblioteca de Mídia, sem o uso de plugins de terceiros. Vamos mergulhar nestas funções e hooks com quatro exemplos práticos.

1. Adicionar Metadados Personalizados aos Tipos de Post de Anexos

Sempre que você faz upload de um arquivo de mídia, o WordPress gera um tipo de post anexo.

Como qualquer outro tipo de post, os anexos são registrados na tabela wp_postmeta, e seus respectivos metadados podem ser encontrados na tabela wp_postmeta do seu banco de dados:

Painel de detalhes de fixação por defeito

Painel de detalhes de fixação por defeito

A tabela wp_posts armazena dados que incluem post_content (descrição do anexo), post_excerpt (legenda do anexo), post_author, post_title, post_status, e post_mime_type.

Cansado dos problemas do WordPress e de um host lento? Fornecemos suporte de classe mundial de especialistas em WordPress disponíveis 24 horas por dia, 7 dias por semana, e servidores de alta velocidade. Confira nossos planos

A tabela wp_postmeta armazena qualquer tipo de metadados, como a URL do arquivo anexado, dimensões da imagem e tipos de mímica, e metadados do formato Exchangeable Image File (EXIF) e do International Press Telecommunications Council (IPTC).

Você pode ocasionalmente precisar adicionar metadados personalizados aos anexos, tais como o nome do autor de um documento, uma URL associada ou o local onde uma foto foi tirada. Adicionar meta campos a anexos é um pouco diferente de adicionar meta campos a postagens, e requer ganchos e funções específicas.

Primeiro, você precisará adicionar todos os campos personalizados necessários à tela Edit Media. Você pode realizar esta tarefa filtrando os campos de anexo disponíveis através do filtro attachment_fields_to_edit em wp-admin/includes/media.php:

function media_hacks_field_to_edit( $form_fields, $post ){

	// https://codex.wordpress.org/Function_Reference/wp_get_metadata
	$media_author = get_post_meta( $post->ID, 'media_author', true );
    
	$form_fields['media_author'] = array(
		'value' => $media_author ? $media_author : '',
		'label' => __( 'Author' )
	); 
	return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_field_to_edit', 10, 2 );

A função tem dois argumentos: o array $form_fields de campos de formulário e o objeto $post. Primeiro, get_post_meta recupera o valor ‘media_author’ existente, depois um elemento ‘media_author’ é adicionado ao array $form_fields.

Finalmente, a callback retorna $form_fields (veja o código em Gist).

Isto irá exibir um novo campo na página Editar Mídia, que você pode acessar selecionando a imagem relevante na sua Biblioteca de Mídia e clicando no link Editar mais detalhes:

Edit more details

Acessando a página da WordPress Edit Media

Na tela resultante, você verá seu novo campo de metadados personalizado na parte inferior:

Novo campo de metadados do

Novo campo de metadados do “autor”

O próximo passo é salvar a entrada do usuário. Você pode fazer isso através da conexão de uma nova função à ação edit_attachment:

function media_hacks_edit_attachment( $attachment_id ){
	if ( isset( $_REQUEST['attachments'][$attachment_id]['media_author'] ) ) {
    
		$media_author = $_REQUEST['attachments'][$attachment_id]['media_author'];
    
		update_post_meta( $attachment_id, 'media_author', $media_author );
	}
}
add_action( 'edit_attachment', 'media_hacks_edit_attachment' );

Esta função mantém apenas um argumento: o $attachment_id do arquivo de mídia atual. Primeiro, a função verifica se um valor válido para o meta-campo personalizado foi enviado. Depois ele registra o valor graças à função update_post_meta (veja o código no Gist).

Agora, você pode recuperar o valor ‘media_author’ graças à função get_post_meta:

$media_author = get_post_meta( $post->ID, 'media_author', true );

Depois disso, você pode exibi-la em qualquer lugar do frontend.

2. Exibir Metadados EXIF e IPTC na tela Edit Media

O WordPress armazena automaticamente metadados estendidos para os tipos de mime JPEG e TIFF. Agora que você sabe como adicionar campos à tela Edit Media via media.php, você pode exibir esses dados.

Para realizar esta tarefa, você tem que mudar a primeira função de callback da seguinte forma:

function media_hacks_attachment_fields_to_edit( $form_fields, $post ){

	// get post mime type
	$type = get_post_mime_type( $post->ID );

	// get the attachment path
	$attachment_path = get_attached_file( $post->ID );

	// get image metadata
	$metadata = wp_read_image_metadata( $attachment_path );

	if( 'image/jpeg' == $type ){

		if( $metadata ) {

			$exif_data = array(
				'aperture'          => 'Aperture', 
				'camera'            => 'Camera', 
				'created_timestamp' => 'Timestamp',
				'focal_length'      => 'Focal Length', 
				'iso'               => 'ISO', 
				'shutter_speed'     => 'Exposure Time', 
				'orientation'       => 'Orientation' );

			foreach ( $exif_data as $key => $value ) {

				$exif = $metadata[$key];
				$form_fields[$key] = array(
					'value' => $exif ? $exif : '',
					'label' => __( $value ),
					'input' => 'html',
					'html'  => "ID][$exif]' value='" . $exif . "' />
				);
			}
		}
	}
	return $form_fields;
}
add_filter( 'attachment_fields_to_edit', 'media_hacks_attachment_fields_to_edit', 10, 2 );

Este trecho utiliza as seguintes funções do WordPress:

Se o tipo mime da imagem é “image/jpeg”, e se metadados existem, então um array de metadados necessários é declarado, e um campo de formulário para cada elemento do array é criado:

metadados EXIF e IPTC

Campos de metadados EXIF e IPTC nos detalhes dos anexos do WordPress

Os campos de formulário deste exemplo são um pouco mais complexos, pois estamos definindo um valor para o elemento de formulário ‘html’ (veja o código em Gist). Você não precisa salvar os metadados EXIF e IPCT, pois o WordPress os armazena automaticamente na tabela wp_postmeta ao fazer upload de imagens.

3. Mostrar Metadados Estendidos no Frontend

Ter todas essas informações para você mesmo na parte de trás é útil. No entanto, se você também quiser mostrar metadados estendidos para seus arquivos de mídia no frontend, você precisará fazer um pouco mais de ajustes.

Para fazer isso, você pode anexar essas informações à descrição do anexo usando um filtro the_content em wp-admin/includes/post.php, dessa forma:

function media_hacks_the_content( $content ){
	global $post;

	if( is_attachment() && 'image/jpeg' == get_post_mime_type( $post->ID ) ) {

		$fields = wp_get_attachment_metadata( $post->ID );
		$meta = $fields['image_meta'];

		if( ! empty( $meta['camera'] ) ){
			$custom_content = "
			<ul>
				<li>Camera: {$meta['camera']}</li>
				<li>Created timestamp: {$meta['created_timestamp']}</li>
				<li>Aperture: {$meta['aperture']}</li>
				<li>Focal length: {$meta['focal_length']}</li>
				<li>ISO: {$meta['iso']}</li>
				<li>Shutter speed: {$meta['shutter_speed']}</li>
				<li>Orientation: {$meta['orientation']}</li>
			</ul>";
			$content .= $custom_content; 
		}
	}
	return $content;
}
add_filter( 'the_content', 'media_hacks_the_content' );

Aqui, a função wp_get_attachment_metadata é chamada. Se o tipo de post atual é “attachment”, e se o tipo de mímica atual é “image/jpeg”, então os metadados de imagem disponíveis são recuperados e usados para construir uma lista não ordenada de campos, que é anexada ao conteúdo do post.

A função chamada de retorno retorna $content (veja este código em Gist):

Metadados EXIF e IPTC exibidos em uma página de anexo

Metadados EXIF e IPTC exibidos em uma página de anexo

Acima você pode ver o novo post anexo com os metadados anexados à descrição.

4. Publicar um Arquivo de Fotos

Fora da caixa, o WordPress não exibe arquivos de anexos. Isto acontece porque a opção has_archive do tipo post anexo está definida como falsa.

Além disso, enquanto o parâmetro padrão post_status do objeto $query é definido para “publish”, o parâmetro padrão do anexo post_status é definido para “inherit”. Isto significa que nenhum anexo será mostrado nos arquivos a menos que nós explicitamente definamos a consulta post_status como “inherit” ou “any” (veja WP_Query Type Parameters para maiores informações).

Dito isto, para mostrar arquivos de imagens, você tem que definir duas funções. A primeira função filtra os argumentos de um tipo de post especificado, e define a propriedade has_archive do anexo como verdadeira:

function media_hacks_register_post_type_args( $args, $post_type ){
	if( $post_type == 'attachment' ){
		$args['has_archive'] = true;
	}
	return $args;
}
add_filter( 'register_post_type_args', 'media_hacks_register_post_type_args', 10, 2 );

A segunda função define valores personalizados para as variáveis de consulta post_mime_type e post_status:

function media_hacks_pre_get_posts( $query ){
	if ( !is_admin() && $query->is_main_query() ) {

		if( is_post_type_archive('attachment') ){
			$query->set('post_mime_type', 'image/jpeg');
			$query->set( 'post_status', 'inherit' );
		}
	}
}
add_action( 'pre_get_posts', 'media_hacks_pre_get_posts' );

A função é ligada ao gancho de ação pre_get_posts, que é disparada após a consulta ter sido criada, mas antes de ser executada. O objeto $query é passado por referência, não por valor, o que significa que qualquer alteração na instância atual do $query afetará o objeto $query original.

Por este motivo, é importante verificar qual consulta você vai mudar (veja este código no Gist). Então se você entrar em https://yourdomain.com/?post_type=attachment no seu navegador, você deve ver um arquivo de imagens JPEG:

Arquivo de Mídia WordPress

Arquivo de Mídia WordPress

O código completo de todos estes hacks está disponível como um plugin em um Gist público, ao qual nós ligamos através desta seção. Você pode baixá-lo como um arquivo .zip e enviá-lo para o seu site WordPress para implementar todos esses quatro hacks, sem ter que editar seus arquivos manualmente.

Uma imagem vale 1.000 palavras... mas só se você souber como importar, editar e gerenciar no seu site WordPress. 🖼 Clique para saber mais neste guia detalhado 📸Click to Tweet

Resumo

Imagens, vídeos, arquivos de áudio e documentos podem ser extremamente valiosos para os usuários do seu site. A Biblioteca de Mídia WordPress é essencial para carregar, publicar e até mesmo modificar esses arquivos para atender às necessidades do seu conteúdo.

Você tem alguma outra pergunta sobre a Biblioteca de Mídia WordPress? Informe-nos na seção de comentários abaixo!


Se você gostou deste artigo, então você vai adorar a plataforma de hospedagem WordPress da Kinsta. Turbine seu site e obtenha suporte 24/7 de nossa experiente equipe de WordPress. Nossa infraestrutura baseada no Google Cloud se concentra em escalabilidade automática, desempenho e segurança. Deixe-nos mostrar-lhe a diferença Kinsta! Confira nossos planos