Behöver du en livekalender som ser professionellt ut på din webbplats för att informera besökare om kommande evenemang eller för att boka ett möte? Istället för att bygga något från grunden eller använda någon anpassad kalenderapp som kanske inte får framtida uppdateringar, varför inte använda något som miljontals andra använder dagligen?

Om du går den vägen kan du bädda in en Google-kalender^{(Google Calendar)} på din webbplats. Det är också gratis och lätt att använda. Allt du behöver för att komma igång är ett Google- konto.

Kom^(Get) igång genom att logga in på ditt Google- konto, klicka på apprutnätet bredvid din profilbild och klicka på Kalender^(Calendar) .

Hämta inbäddningskoden^{(Get the Embed Code)}

Öppna Alternativ genom^{(Options by )} att klicka på de tre prickarna bredvid kalendern du vill bädda in.  

Klicka på Inställningar och delning^{(Settings and sharing)} i popup-fönstret.

Rulla^(Scroll) ner på sidan Kalenderinställningar^(Calendar) tills du hittar avsnittet Integrera kalender .^{(Integrate calendar)}

För att göra din kalender synlig för alla och inte bara för dem du delar den med, måste du göra den offentlig^{( make it public)} .

För att göra detta, aktivera rutan bredvid Gör tillgänglig för allmänheten^{(Make available to public)} under Åtkomstbehörigheter^{(Access permissions)} .

Bädda in koden i HTML -delen av en webbsida eller ett inlägg. Om du till exempel använder WordPress , skapa en ny sida.

Klicka på Text för att växla till HTML- redigeraren. Kopiera inbäddningskoden^(Embed) från din Google - kalender och klistra in den på sidan.

Klicka på fliken Visuellt^{(Visual )} för att se hur kalendern ser ut på din sida. Du kan också välja Förhandsgranska^(Preview) för att se den i fronten av din webbplats.

Klistra in kalenderns HTML^{(Calendar HTML)} -kod på valfri webbsida där du tillåts bädda in objekt.

Om du gillar Googles standardformatinställningar för kalendern är du bra att gå. För att ändra färg, storlek och andra alternativ för din kalender kan du anpassa dess inställningar.

Anpassa Google Kalender-inställningar^{(Customize Google Calendar Settings)}

Klicka på knappen Anpassa som finns direkt under inbäddningskoden. ^(Customize)Detta öppnar ett nytt fönster.

Redigera eller lägg till en titel i din kalender genom att skriva den under Kalenderrubrik^{(Calendar title)} . Om du vill att titeln ska visas, aktivera rutan bredvid Titel^(Title) .

Ange^(Specify) vilka element du vill visa i din kalender genom att markera följande inställningar under Visa^(Show) :

• Titel
• Navigeringsknappar
• Data
• Skriv ut ikon
• Flikar
• Kalenderlista
• Tidszon

Standardstorleken på Google Kalender^{(Google Calendar)} är 800 gånger 600. Ändra storleken genom att flytta upp- och nedpilarna bredvid Bredd^(Width) och Höjd^(Height) .

Om du till exempel vill bädda in en kalender i en sidofält, minska bredden^(Width) till en mindre storlek, till exempel 300.

Andra inställningar du kan anpassa inkluderar:

• Bakgrundsfärg^(Background) för att matcha din varumärkesfärg
• Tidszon och språk
• Kant (på eller av)
• Standardmånad
• Första dagen i veckan

När du har anpassat alternativen kan du se din sista livekalender på din webbsida. När du ändrar en händelse i din kalender uppdateras den automatiskt.

Nedan^(Below) är en skärmdump av månadsvyn.

Du kan även se din kalender per vecka.

Om du vill göra några ändringar kan du alltid gå tillbaka till dina Google Kalender^{(Google Calendar)} -inställningar och justera dem.

Se till att kopiera och klistra in den nya HTML -koden efter att ha gjort några formateringsuppdateringar för att återspegla de nya ändringarna.

Hur man låter besökare spara en kalenderhändelse^{(How to Let Visitors Save a Calendar Event)}

För att göra det möjligt för besökare att spara ditt evenemang i sin egen Google Kalender^{(Google Calendar)} , lägg till en knapp på din webbplats. Se^(Make) till att din kalender är offentlig.

Öppna din Google Kalender^{(Google Calendar)} . Observera att ändringar endast kan göras från en dator och inte en mobilapp.

För att lägga till en händelse, välj dagen du vill lägga till den och klicka på Skapa^(Create) i det övre vänstra hörnet.

Fyll^(Fill) i informationen om ditt evenemang i popup-fönstret och klicka på Spara^(Save) .

För att öppna en händelse i din kalender, dubbelklicka på den. Klicka sedan på de tre prickarna i det övre högra hörnet för att öppna Alternativ^(Options) och välj Publicera händelse^{(Publish event)} .

Bädda in HTML -koden från popup-fönstret på din webbplats så att besökare kan lägga till händelsen i sin egen Google Kalender^{(Google Calendar)} .

Gå tillbaka till din webbplats och klistra in koden från käll- eller HTML - vyn där du vill att händelseknappen ska visas.

När en besökare klickar på Google Kalender-^{(Google Calendar)} knappen kommer den att öppna sin kalender och lägga till händelsen i den. Du kan också bjuda in personer till ditt evenemang med hjälp av länken som visas i samma popup-fönster.

Bädda in Google Kalender i WordPress med plugins^{(Embed Google Calendar into WordPress Using Plugins)}

Som med de flesta funktioner i WordPress finns det ett plugin för det. Att bädda in en Google-kalender^{(Google Calendar)} på en WordPress- webbplats är inget undantag. Nedan finns flera WordPress- plugins som du kan överväga att använda. 

Enkel kalenderplugin^{(Simple Calendar Plugin)}

Enkel kalender^{(Simple Calendar)} visar dina händelser per vecka, månad eller i en lista. Det är enkelt att konfigurera, mobilt lyhört och anpassningsbart efter dina behov.

Andra funktioner inkluderar: 

• Hantera händelser i Google och få dem uppdaterade automatiskt i WordPress
• Färgkodshändelser
• Intuitivt och enkelt att konfigurera
• Ytterligare funktionalitet med tillägg^{( add-ons)}

Detta plugin är ett utmärkt val för avancerade Google Kalender^{(Google Calendar)} -användare. En unik funktion är möjligheten att överföra färgkodade händelser.

Dan's Embedder för Google Kalender^{(Dan’s Embedder for Google Calendar)}

Visa Google^{(Display Google)} -kalendrar i en lista eller fullständig vy med Dan's Embedder för Google Calendar .

Det finns inget behov av att hantera eller importera händelser i WordPress . Du behöver bara en eller flera offentliga Google-kalendrar^{(Google Calendars)} . Andra funktioner inkluderar:

• Konfigurera alternativ med kortkoder
• Ange hur många objekt som ska visas
• Bädda in flera kalendrar 

Denna plugin kräver en API- nyckel. Följ stegen nedan för att få din:

• Besök Google Developers Console
• Från sidomenyn, kontrollera API:er och autentisering^{(APIs and auth)} > Inloggningsuppgifter^(Credential)
• Klicka på knappen Skapa ny nyckel i avsnittet ^{(Create new key)}Public API- åtkomst
• Välj webbläsarnyckel^{(Browser key)} och lämna referensbegränsning^{(Referrer Limitation)} tomt
• Sätt den här nyckeln på sidan för plugininställningar

Händelsekalender WD^{(Event Calendar WD)}

Skapa^(Create) en evenemangskampanj och hantera eller lägg till evenemang i din WordPress- blogg med Event Calendar WD .

Ge en detaljerad beskrivning av dina händelser med WordPress- redigeraren, bifoga taggar och tilldela kategorier till var och en. Några andra funktioner inkluderar:

• Användarvänligt gränssnitt för full kontroll över hur du visar kalendrar och händelser på din webbplats
• Anpassa och hantera dina kalendrar enkelt
• Ett obegränsat antal kalendrar och evenemang
• Optimera varje event för bättre SEO och sökmotorsynlighet
• Aktivera sociala delningsknappar för att sprida budskapet om dina evenemang

WP enkel bokningskalender^{(WP Simple Booking Calendar)}

^(Quickly)Installera och bädda in Google-kalendrar ^{(Google Calendars)}snabbt och enkelt på din webbplats.

Gratisversionen av WP Simple Booking Calendar ger dig tillgång till de grundläggande funktionerna du behöver som att hålla reda på dina händelser. Höjdpunkterna i gratisversionen inkluderar:

• Responsiv layout
• Säkerhetskopiera^(Backup) och återställa data och kalendrar
• Visa din tillgänglighet 

För mer avancerade publicerings- och redigeringsfunktioner kan du uppgradera till Premium- versionen.

Användare som vill hantera och visa sin tillgänglighet för sina tjänster på sin webbplats eller annonsera kommande evenemang kommer att ha stor nytta av att bädda in en Google-kalender^{(Google Calendar)} på sin webbplats.

Att integrera en kalender direkt på din webbplats kommer att behålla besökarna på din webbplats och öka chanserna att de bokar ett möte eller registrerar sig för ett evenemang.

Allt du behöver är en internetanslutning, en webbläsare och ett Google -konto för att skapa och visa en professionell kalender på din webbplats.

How To Embed Google Calendar On Your Website

Do you need a рrofessional-looking live calendar on yoυr website to lеt visitors know about upcoming events or to schedule an appоintment? Instеad of building something from scratch or using some custom calendar app that might not get fυture updates, why not use something that millions of others are using on a daily basis?

Going that route, you can embed a Google Calendar onto your site. It’s also free and easy to use. All you need to get started is a Google account.

Get started by logging into your Google account, click on the apps grid next to your profile picture and click on Calendar.

Get the Embed Code

Open Options by clicking on the three dots adjacent to the calendar you want to embed.  

Click on Settings and sharing from the popup.

Scroll down the Calendar settings page until you find the Integrate calendar section.

To make your calendar visible to everyone and not only those you share it with, you will need to make it public.

To do this, enable the box next to Make available to public under Access permissions.

Embed the code into the HTML section of a web page or post. For example, if you are using WordPress, create a new page.

Click on Text to switch to the HTML editor. Copy the Embed code from your Google calendar and paste it into the page.

Click on the Visual tab to see what the calendar looks like on your page. You can also select Preview to see it on the front end of your website.

Paste the Calendar HTML code into any web page where you’re allowed tto embed objects.

If you like Google’s default format settings for the calendar, you’re good to go. To change the color, size, and other options of your calendar, you can customize its settings.

Customize Google Calendar Settings

Click the Customize button located directly under the embed code. This will open a new window.

Edit or add a title to your calendar by typing it under Calendar title. If you want the title to show, enable the box next to Title.

Specify which elements you want to show on your calendar by checking the following settings under Show:

• Title
• Navigation buttons
• Data
• Print icon
• Tabs
• Calendar list
• Time Zone

The default size of the Google Calendar is 800 by 600. Change the size by moving the up and down arrows next to Width and Height.

For example, if you want to embed a calendar on a sidebar, reduce the Width to a smaller size such as 300.

Other settings you can customize include:

• Background color to match your brand color
• Time zone and language
• Border (on or off)
• Default month
• First day of the week

After you customize the options, view your final live calendar on your web page. When you change an event on your calendar, it will update automatically.

Below is a screenshot of the monthly view.

You can also view your calendar by week.

If you want to make any changes, you can always go back to your Google Calendar settings and adjust them..

Be sure to copy and paste the new HTML code after making any formatting updates  to reflect the new changes.

How to Let Visitors Save a Calendar Event

To enable visitors to save your event on their own Google Calendar, add a button to your website. Make sure your calendar is public.

Open your Google Calendar. Note that changes can only be made from a computer and not a mobile app.

To add an event, select the day you want to add it to and click on Create in the top left-hand corner.

Fill in the details of your event in the popup and click Save.

To open an event in your calendar, double-click it. Then click the three dots in the upper right-hand corner to open Options, and select Publish event.

Embed the HTML code from the popup window on your website to enable visitors to add the event to their own Google Calendar.

Go back to your website and paste the code from the source or HTML view where you want the event button to display.

When a visitor clicks on the Google Calendar button, it will open their calendar and add the event to it. You can also invite people to your event using the link displayed in the same popup window.

Embed Google Calendar into WordPress Using Plugins

As with most functions in WordPress, there is a plugin for that. Embedding a Google Calendar into a WordPress website is no exception. Below are several WordPress plugins for you to consider using. 

Simple Calendar Plugin

Simple Calendar shows your events by week, month, or in a list. It’s easy to set up, mobile responsive, and customizable to your needs.

Other features include: 

• Manage events in Google and have them updated automatically in WordPress
• Color code events
• Intuitive and straightforward to configure
• Additional functionality with add-ons

This plugin is an excellent choice for Google Calendar power users. One unique feature is the ability to transfer color-coded events.

Dan’s Embedder for Google Calendar

Display Google calendars in a list or full view with Dan’s Embedder for Google Calendar.

There is no need to manage or import events in WordPress. You only need one or more public Google Calendars. Other features include:

• Configure options with shortcodes
• Specify how many items to show
• Embed multiple calendars 

This plugin requires an API key. Follow the steps below to get yours:

• Visit Google Developers Console
• From the side menu, check APIs and auth > Credential
• Click the Create new key button from the Public API access section
• Select Browser key and leave Referrer Limitation blank
• Put this key on the plugin settings page

Event Calendar WD

Create an event promotion and manage or add events to your WordPress blog with Event Calendar WD.

Provide a detailed description of your events using the WordPress editor, attach tags, and assign categories to each one. Some other features include:

• User-friendly interface for full control over how you display calendars and events on your website
• Easily customize and manage your calendars
• An unlimited number of calendars and events
• Optimize every event for better SEO and search engine visibility
• Enable social sharing buttons to spread the word about your events

WP Simple Booking Calendar

Quickly and easily install and embed Google Calendars on your website.

The free version of WP Simple Booking Calendar gives you access to the basic features you need such as keeping track of your events. Highlights of the free version include:

• Responsive layout
• Backup and restore data and calendars
• Display your availability 

For more advanced publishing and editing functions, you can upgrade to the Premium version.

Users who want to manage and display their availability for their services on their website or announce upcoming events will benefit greatly from embedding a Google Calendar on their site.

Integrating a calendar directly on your website will keep visitors on your site and increase the chances they’ll make an appointment or sign up for an event.

All you need is an internet connection, a web browser, and a Google account to create and display a professional-looking calendar on your site.

Related posts

• Hur man bäddar in Google Forms på din webbplats

• Hur man använder Google Kalender: 10 proffstips

• Så här använder du Google Familjekalender för att hålla din familj i tid

• 2 Chrome adressfältsgenvägar för att skapa Google Kalender-händelser

• Användarforskningsmetoder i Google Analytics för att öka webbplatstrafiken

• Hur man filtrerar i Google Sheets

• Hur man använder Google Sheets rullgardinslistor

• Hur man fixar Gmail när det inte tar emot e-postmeddelanden

• 10 Google Kalender-tips för att minska din schemastress

• Hur man exporterar och importerar Chrome-bokmärken

• Vad är förbättrat skydd i Google Chrome och hur man aktiverar det

• Hur man sorterar eller filtrerar efter färg i Google Sheets

• Hur fungerar YouTube-algoritmen?

• Varför Google Kalender är den bästa onlinekalendertjänsten

• Hur man gör ett visitkort i Google Drive

• Hur man gör ett linjediagram i Google Sheets

• Vad är Googles exponeringsmeddelanden för covid-skydd?

• Hur man skapar ett Google-formulär: En komplett guide

• Vad är Google-appen och hur man använder den

• Får du inte Gmail-aviseringar? 10 sätt att fixa