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

Como fazer, Marketing, Actualizações / 1 de janeiro de 2024 / Por Robin Pietersen

Neste tutorial, mostraremos como adicionar um calendário de eventos Elementor usando FooEvents em 2024. Os calendários exibirão vários eventos que são exibidos em várias guias usando diferentes modos de exibiçã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.

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.

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.

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 de eventos Elementor utilizando FooEvents

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

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

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

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