Criar um calendário de eventos no Elementor usando FooEvents (2024) - FooEvents

Criar um calendário de eventos no Elementor utilizando FooEvents (2024)

Neste tutorial, vamos mostrar-lhe como adicionar um calendário de eventos Elementor utilizando FooEvents em 2024. Os calendários apresentam vários eventos que são apresentados em vários separadores utilizando diferentes modos de visualização.

Passo 1: Instalar os plugins Elementor e FooEvents Calendar

Em primeiro lugar, terá de se certificar de que tem o Elementor plugin instalado. Pode ser encontrado em wordpress.org e instalado diretamente a partir da secção de plugins do seu sítio Web.

Entre no seu painel de administração do WordPress e navegue até Plugins > Adicionar novo. Em seguida, procurar Elementor e instalar o Construtor de sites Elementor plugin.

Calendário de eventos Elementor

Em seguida, procure por FooEvents e instalar o Calendário de eventos para FooEvents O FooEvents oferece duas maneiras de criar eventos no seu site WordPress. A primeira opção é adicionar detalhes do evento a um post ou página padrão do WordPress usando a opção Calendário FooEvents plugin. Isto é feito ao editar o post ou a página. O plugin FooEvents Calendar adiciona um formulário básico de configuração de eventos na parte inferior do post, páginas e tipos de post personalizados. Utilizando este formulário, pode definir a data e a hora do evento. Uma vez definidos, eles serão exibidos nos calendários gerados pelo plugin de calendário FooEvents.

Captura de ecrã das definições de eventos do post e da página do calendário do Fooevents

A segunda opção, mais sofisticada, é utilizar o FooEvents para WooCommerce plugin e extensões para adicionar a funcionalidade de eventos e emissão de bilhetes aos seus produtos WooCommerce. O FooEvents para o WooCommerce permite vender bilhetes ilimitados diretamente a partir do seu sítio Web, bem como gerir os check-ins utilizando a aplicação gratuita FooEvents Aplicações de check-ins. O FooEvents Reservas O plugin também pode ser utilizado para vender acesso a intervalos de tempo reserváveis, o que será ilustrado mais adiante neste tutorial.

Depois de ter configurado alguns eventos de teste, avance para o passo seguinte.

Passo 2: Criar uma nova página

Crie uma nova página e defina o título da página. Em seguida, vá para o construtor de páginas Elementor premindo o botão Editar com o Elementor botão.

A captura de ecrã mostra um título de página a ser definido

Passo 3: Adicionar o elemento Elementor Tabs

Quando a página carregar, adicione um elemento Tabs à secção principal da página. Por predefinição, o Elementor criará dois separadores de amostra. Remova o segundo separador e expanda as opções de edição do primeiro separador.

Passo 4: Adicionar um calendário para todos os eventos

Captura de ecrã do Elementor a ser utilizado para adicionar um calendário ao elemento separador

Modifique o primeiro separador e altere o título para "Todos", antes de adicionar o separador FooEvents Código curto do calendário para a secção de conteúdo do separador.

[fooevents_calendar id="1"]

Ao adicionar vários calendários a uma página, é importante especificar um ID único para cada calendário (por exemplo, id="1″). Pode então pré-visualizar o calendário, que apresentará todos os eventos a decorrer no mês atual.

Passo 5: Adicionar um calendário para categorias de eventos específicas

Captura de ecrã do Elementor a ser utilizado para adicionar um calendário ao elemento do separador que apresenta as actividades

Em seguida, duplique o separador que acabámos de criar e altere o título para actividades. Este calendário precisa então de mostrar todos os eventos que são actividades. Ao criar eventos usando o plugin FooEvents para WooCommerce, pode organizar os eventos usando a funcionalidade de categorias do WooCommerce. Para esta demonstração, adicionamos a excursão Bus Tour à categoria de atividades. Usando o parâmetro include_cat shortcode, podemos então filtrar o calendário para mostrar apenas eventos que foram categorizados como atividades. Também podemos duplicar este processo para eventos que foram categorizados como "Conferências".

[fooevents_calendar id="2″ include_cat="activities"]

Passo 6: Adicionar calendários para períodos de tempo específicos

Captura de ecrã do Elementor a ser utilizado para adicionar um calendário ao elemento do separador que apresenta todos os eventos que têm lugar na semana atual

Criar um calendário que apenas apresenta eventos que ocorrem no dia atual do calendário utilizando o parâmetro defaultview com o valor definido como listday. Também pode utilizar este parâmetro em combinação com outros parâmetros, como o parâmetro include_cat, se necessário. Siga o mesmo processo e crie um separador da vista Semana onde especificamos a vista predefinida como listWeek. Esta vista apresentará então todos os eventos que estão a ocorrer na semana atual.

Criar um separador de vista de mês que apresenta todos os eventos que ocorrem no mês de calendário atual utilizando listMonth e o parâmetro defaultdate para especificar o mês a apresentar. Criar um separador para apresentar todos os eventos que ocorrem no ano atual utilizando o valor listYear.

[fooevents_calendar id="3″ defaultview="listDay"]

Passo 7: Adicionar um calendário para eventos de repetição específicos

Captura de ecrã do Elementor a ser utilizado para adicionar um calendário ao elemento do separador que apresenta todas as ocorrências das reservas de excursões de autocarro

Crie um calendário para eventos repetidos específicos. Por exemplo, a excursão de autocarro utiliza o plug-in de reservas FooEvents e repete-se em várias datas e faixas horárias. Pode criar um calendário que mostre apenas estas faixas horárias, especificando o ID do produto. Para tal, basta obter o ID, criar um separador chamado "Visita ao autocarro" e definir o ID do produto como parâmetro de publicação. O calendário mostrará apenas as marcações para este evento.

É isso mesmo! Agora já sabe como utilizar o FooEvents e o Elementor para adicionar calendários de eventos ao seu sítio Web que apresentam vários eventos em vários separadores, utilizando vários modos de apresentação. Cada um desses calendários pode ser ainda mais filtrado usando uma série de parâmetros de shortcode. Pode ler mais sobre estes parâmetros visitando o centro de ajuda do FooEvents e navegando para a secção calendário shortcodes ajuda doc.

Poderá também interessar-lhe este conteúdo do nosso parceiro FooSales WooCommerce POS:

Subscrever a nossa newsletter

Seja o primeiro a receber actualizações de produtos e ofertas especiais

    Carrinho de compras