Difference between revisions of "Google Font on Booking Page"

From Beds24 Wiki
Jump to navigation Jump to search
Beds24>Annette
 
m (1 revision imported)
 
(2 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
[[Category:How to]]
 
[[Category:How to]]
 
[[Category:Booking_Page]]
 
[[Category:Booking_Page]]
  ''This page explains how to install Google fonts''
+
<div class="heading">Custom Fonts or Google Fonts</div>
'''Requires:'''  Knowledge of HTML, CSS  
+
  This page explains how to install Google fonts. You can use this method for other web fonts as well.
 +
<span style="color: #f3e504; font-size: 250%;" >{{#fas:lightbulb}} </span> '''Requires:'''  Knowledge of HTML, CSS  
  
1. To embed your collection into your booking page, paste the link google provides for the font you want to use into paste in into SETTINGS -> BOOKING PAGE -> DEVELOPERS "Advanced HTML Settings" ->"Insert in HTML <HEAD>"
+
1. To embed your font collection into your booking page, paste the link google provides for the font you want to use into paste in into {{#fas:cog}} (SETTINGS)  > BOOKING ENGINE  > PROPERTY BOOKING PAGE > DEVELOPERS "Advanced HTML Settings" ->"Insert in HTML <HEAD>"
  
 
Example link for "Open Sans"  
 
Example link for "Open Sans"  
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
+
 
 +
<code><link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'></code>
  
 
2. Add the custom CSS  
 
2. Add the custom CSS  
  
 
Example for "Open Sans":
 
Example for "Open Sans":
.colorbody{font-family: 'Open Sans', sans-serif;}
+
 
 +
<code> .colorbody{font-family: 'Open Sans', sans-serif;}</code>
 +
 
 
replace  
 
replace  
 +
 
font-family: 'Open Sans', sans-serif;
 
font-family: 'Open Sans', sans-serif;
  
 
with the font you want to use.
 
with the font you want to use.
 
Keywords: font, google font, custom font
 

Latest revision as of 01:32, 19 May 2021

Custom Fonts or Google Fonts
This page explains how to install Google fonts. You can use this method for other web fonts as well. 

{{#fas:lightbulb}} Requires: Knowledge of HTML, CSS

1. To embed your font collection into your booking page, paste the link google provides for the font you want to use into paste in into {{#fas:cog}} (SETTINGS) > BOOKING ENGINE > PROPERTY BOOKING PAGE > DEVELOPERS "Advanced HTML Settings" ->"Insert in HTML <HEAD>"

Example link for "Open Sans"

<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>

2. Add the custom CSS

Example for "Open Sans":

.colorbody{font-family: 'Open Sans', sans-serif;}

replace

font-family: 'Open Sans', sans-serif;

with the font you want to use.