Destaque do plug-in Divi: reserva de hotel e integração com Divi

A reserva de hotéis do MotoPress é um dos plug-ins de reserva mais populares do WordPress. Ele se integra bem ao Divi, mas como um plugin independente, não tira proveito do Divi Builder e de seus recursos de design. A integração da reserva do hotel com Divi é possível usando o plugin Hotel Booking & Divi Integration do MotoPress.

Usando a versão gratuita ou premium do Hotel Booking, é fácil adicionar um recurso de reserva de hotel a qualquer site da Divi e estilizá-lo com o Divi Builder. Neste artigo, vamos dar uma olhada nos vários plug-ins e opções, ver como eles funcionam com o Divi Builder e como eles se integram aos layouts Divi.

Plug-ins de reserva de hotel

Aqui está uma olhada nos plug-ins de integração Divi de reserva de hotel.

Hotel Booking Lite

A versão Lite do Hotel Booking é gratuita. É um plugin de aluguel de propriedades feito especificamente para empresas de hospedagem. Ele pode lidar com quartos ilimitados, fornece detalhes de propriedade, pesquisa inteligente, variáveis ​​ilimitadas para taxas, períodos de estadia mínimo e máximo, serviços extras gratuitos ou pagos, cupons, impostos, várias acomodações por hóspede e muito mais.

Ele também inclui várias moedas, localização, códigos de acesso e widgets. Ele tem tudo que você precisa para começar com o gerenciamento de propriedades e inclui integração com o PayPal. Para este artigo, estarei usando a versão Lite.

Hotel Booking Pro

A versão Pro adiciona mais gateways de pagamento, sincronização automática com OTAs (calendários de troca), a capacidade de adicionar reservas do back-end, preços variáveis ​​com base no número de hóspedes e noites hospedadas e outras opções e atualizações prioritárias e suporte.

Reserva de hotel e integração com Divi

Hotel Booking & Divi Integration é um add-on gratuito que adiciona novos módulos ao Divi Builder para que você possa criar as páginas de reserva e estilizá-las com Divi. Os módulos permitem que a Divi estilize e exiba as acomodações como listas, como uma única acomodação, serviços, formulários, buscas, etc. Inclui recursos para habilitar ou desabilitar praticamente todos os elementos para que você possa personalizar como eles são exibidos. O estilo com os módulos Divi funciona da mesma forma que qualquer módulo, então você tem controle total sobre sua aparência.

Usando Hotel Booking & Divi Integration

Novas páginas padrão da reserva de hotéis

Depois de instalar o plugin Hotel Booking, você verá uma mensagem para instalar as páginas. Essas são páginas que o mecanismo de reserva de hotéis usa para transações, etc., portanto, recomendo que você as crie. Clique no botão.

Oito novas páginas publicadas são adicionadas à instalação do WordPress. Essas páginas contêm o título e um código de acesso que informa ao sistema de reservas quais páginas usar para fornecer informações. Essas páginas seriam usadas se você não estivesse usando o Divi Builder. Prefiro criá-los com um único clique e depois personalizar cada um com Divi. Isso informa exatamente quais páginas você precisa construir.

Obviamente, você também pode usar os códigos de acesso dessas páginas em outros layouts, mas não precisará deles graças aos módulos Divi Builder.

Aqui está um exemplo da página de acomodações. Ele adiciona o título e o código de acesso para exibi-los. Ele mostra o controle deslizante da imagem em destaque, galeria e informações sobre cada um. Eu adicionei o widget à barra lateral para mostrar os tipos de acomodação.

Módulos Divi

Novos módulos são adicionados ao Divi Builder. Eles incluem:

• Lista
• Cotações
• Serviços de Acom
• Formulário de inscrição
• Disponibilidade de pesquisa
• Single Accom.

Esses módulos permitem criar páginas completas com Divi ou adicionar recursos individuais nos layouts Divi.

Exemplos de Módulo Divi

Recriei o mesmo layout da página Acomodações usando o Divi Builder. Eu adicionei a barra lateral apenas para combinar.

O resultado é muito semelhante. Claro, agora podemos brincar com opções de estilo e layout.

Os módulos oferecem controle total sobre o que é exibido.

Inclui muitas personalizações para que você possa controlar elementos como categorias, tags, classificação, ordem, o número a ser mostrado em uma página, etc. Ele ainda tem uma opção de relacionamento lógico para ajudar a decidir taxonomias quando há mais de uma.

Eu o configurei para mostrar um por página por data em ordem crescente. A página já está mais limpa e fácil de usar. Removi a descrição e o botão de reserva. A imagem apresentada é um controle deslizante com controles. Como limitei o número de acomodações que ele pode exibir, ele adiciona paginação automaticamente.

Aqui, adicionei o trecho e os detalhes novamente e estou estilizando o texto na guia Design usando o construtor de front-end. Eu adicionei uma sombra de caixa com algum preenchimento.

Você também pode especificar qual acomodação será exibida com base em IDs. Neste exemplo, criei um novo layout com dois módulos de Lista de acomodações. Cada um está mostrando um ID específico. Eles incluem espaçamento e sombra da caixa.

O módulo de acomodação individual permite que você exiba qualquer acomodação desejada com base no ID. Inclui os mesmos recursos do módulo de lista para desabilitar ou estilizar qualquer um dos elementos.

O módulo de Disponibilidade de Pesquisa permite que seus visitantes pesquisem com base na data de check-in, data de check-out, o número de adultos e o número de crianças. Você pode definir os limites e adicionar atributos. Inclui três layouts. Este é o padrão. Eu adicionei uma sombra de caixa para que fique separada do fundo.

Este é o layout central horizontal. Isso funcionaria muito bem como uma seção própria em uma página de destino. Esquerda horizontal tem a mesma aparência, mas posiciona a caixa de pesquisa à esquerda. Neste exemplo, adicionei uma borda, alterei a cor do plano de fundo, alterei a cor da fonte e defini as fontes do título do campo em maiúsculas.

O módulo de serviços de acomodação exibe todos os serviços ou serviços específicos com base em IDs. Inclui todos os mesmos recursos de design aos quais estamos acostumados. Sem um ID, ele mostrará todos os serviços em uma lista. Adicionar o ID significa que você pode colocar qualquer serviço em qualquer lugar e mostrar vários serviços em qualquer layout usando vários módulos.

Integração da reserva de hotel aos layouts Divi

Qualquer um dos layouts Divi pode ser personalizado para criar um site de hotel, mas existem alguns que funcionam perfeitamente sem muitas mudanças, como Imóveis, Blog de viagens e Cama e café da manhã. Estou usando o Bed and Breakfast (e, graças a escrever este artigo, agora quero começar um bed and breakfast).

Neste exemplo, removi as sinopses e o botão e adicionei o módulo de Disponibilidade de Pesquisa à área principal da página de destino. Ele está usando o layout esquerdo horizontal. Deixei as configurações no padrão.

Neste exemplo, substituí o vídeo incorporado pela galeria abaixo dele com um módulo de Lista de acomodações. Eu o configurei para mostrar um, mas inclui paginação se você quiser ver mais. Desativei a maior parte do texto, mas mostra o botão de detalhes.

Parece quase exatamente igual à seção original neste layout, mas agora podemos escolher quartos ou acomodações específicas para mostrar e alterá-los simplesmente colando seu ID. A paginação também ajuda a fornecer mais informações no mesmo espaço.

Reflexões finais

Hotel Booking & Divi Integration é fácil de configurar e usar. Nunca precisei ler as instruções, mas elas incluem uma postagem de blog detalhada para guiá-lo se você quiser ler. Gosto de usar o Divi Builder para todas as páginas que a reserva de hotéis cria.

É possível adicionar shortcodes para os elementos, mesmo dentro do Divi Builder, mas as opções de design ainda são limitadas, o que se resolve com os módulos Divi. Usar o Divi Builder torna muito mais fácil criar um estilo exclusivo para suas páginas e é fácil adicionar os elementos exatos nos layouts que você deseja.

O MotoPress tem vários temas de hotéis e aluguel de propriedades disponíveis para WordPress. Eu gostaria de ver alguns layouts Divi adicionados à lista. Elegant Themes já tem vários layouts que funcionam muito bem para hotéis e pousadas de aluguel, então usar Hotel Booking & Divi Integration parece natural.

Se você criar sites de hotéis e aluguéis com o Divi, precisará da integração do Divi para reservas de hotéis. Eu recomendo usar até mesmo a versão gratuita do plugin Hotel Booking junto com o add-on Hotel Booking & Divi Integration. Agora eu tenho que planejar meu B&B.

Nós queremos ouvir de você. Já experimentou Hotel Booking & Divi Integration? Deixe-nos saber o que você pensa sobre isso nos comentários abaixo.

Imagem em destaque via Sira Anamwong / shutterstock.com