Como Ligar o Logótipo do Seu Formulário de Páginas de Formulário

Introdução

Gostaria de ligar o logótipo das suas Páginas de Formulário do seu formulário à sua página inicial? Neste tutorial, vamos criar um formulário utilizando o complemento Páginas de Formulário do WPForms, carregar um logótipo para o nosso formulário e, em seguida, adicionar um trecho de código que ligará esse logótipo de volta à nossa página inicial.

Criar o seu formulário

Primeiro, precisaremos de criar um novo formulário e adicionar os nossos campos a este formulário. Para efeitos deste tutorial, vamos apenas criar um formulário de reserva com alguns campos básicos.

Ativar Páginas de Formulário

Em seguida, terá de ativar o formulário para utilizar Páginas de Formulário. Para qualquer assistência com isto, consulte esta documentação.

Dentro do construtor de formulários, clique em Definições e depois em Páginas de Formulário para ativar isto para o seu formulário.

Carregar o seu logótipo

Enquanto estiver no separador Páginas de Formulário, clique em Carregar Imagem e carregue o seu logótipo. Assim que terminar, clique em Guardar para guardar as alterações.

Por defeito, esta imagem não está associada a nada. No próximo passo, vamos adicionar um trecho de código que associará esta imagem de volta à página inicial.

Adicionar o trecho de código para ligar o logótipo do seu formulário

Agora é hora de adicionar um trecho de código ao seu site que transformará a imagem do seu logótipo num link. Se precisar de ajuda para adicionar trechos de código ao seu site, consulte este tutorial.

/**
 * Link your form logo on form pages.
 *
 * @link   https://wpforms.com/developers/how-to-link-your-form-pages-form-logo/
 */

function wpf_dev_form_pages_add_link() {
	?>
	<script type="text/javascript">
		jQuery( function( $ ) {

			// Could be removed if changes are needed in all form pages on the site.
			var formID = 375;// ID of form page form to which apply changes.

			if ( $( '#wpforms-' + formID ).length === 0 ) {
				return;
			}

			// Detect Form Page image.
			var $logo = $( '#wpforms-form-page-page' ).find( '.wpforms-custom-logo img' );

			if ( $logo.length > 0 ) {
				$logo.wrap($( '<a>',{
					href: '/' // "/" could be changed to any link.
				}));
			}
		} );
	</script>
	<?php
}
add_action( 'wpforms_wp_footer_end', 'wpf_dev_form_pages_add_link', 30 );

No trecho de código acima, o var formID = 375 é o número de ID do formulário. Este terá de ser alterado para corresponder ao ID do seu formulário. Se precisar de ajuda para localizar o ID do seu formulário, reveja este tutorial.

Agora, quando visualizar o seu formulário e passar o rato sobre a imagem do logótipo, verá o ponteiro para clicar na imagem.

E é tudo o que precisa para ligar o logótipo do seu formulário nas suas páginas de formulário. Gostaria de fazer o mesmo para o complemento Formulários Conversacionais? Dê uma vista de olhos ao nosso tutorial sobre Como Ligar o Logótipo do Seu Formulário Conversacional.

Relacionado

Referência de Ação: wpforms_wp_footer_end