Dealership & Barn reservations

24.4.3 AM

Buttons with (a href=”url” data-tock-business=”businessname” data-tock-reserve=true):
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtDealership&lt/button&gt&lt/a&gt doesn’t work
Dealership

&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtThe Barn&lt/button&gt&lt/a&gt works well
The Barn

To have two separate location widgets, you can not also use the integrated WordPress widget feature and will have to remove it to only use the provided HTML code.

For the HEAD code:
(script code below)

&ltscript&gt

!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version='1.0',e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,'script','https://www.exploretock.com/tock.js');

tock('init', 'drakes-brewing-dealership-oakland');

tock('init', 'drakesbarn');

&lt/script&gt


!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version=’1.0′,e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,’script’,’https://www.exploretock.com/tock.js’);

tock(‘init’, ‘drakes-brewing-dealership-oakland’);

tock(‘init’, ‘drakesbarn’);

(script code ends)
Buttons with (a href=”url” data-tock-business=”businessname” data-tock-reserve=true):
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtDealership&lt/button&gt&lt/a&gt doesn’t work
Dealership

&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtThe Barn&lt/button&gt&lt/a&gt works
The Barn

You will need to place the following lines of code in their respective locations of the BODY to display where you would like on the website.

BODY code:

&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gtDealership&lt/a&gt doesn’t work
Dealership

&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gtThe Barn&lt/a&gt works
The Barn

To have two separate location widgets, you can not also use the integrated WordPress widget feature and will have to remove it to only use the provided HTML code.

For the HEAD code:
(html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle&gtTock Button&lt/title&gt
&ltstyle&gt
/* Remove default margin and padding */
body, html {
margin: 0;
padding: 0;
}
/* Apply styles to the button */
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 10px 20px; /* Adjust padding as needed */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt &lt!-- button works --&gt

&lt/body&gt
&lt/html&gt


/* Remove default margin and padding */
body, html {
margin: 0;
padding: 0;
}
/* Apply styles to the button */
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 10px 20px; /* Adjust padding as needed */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

(Tock Button wrapped inside an anchor tag)
Book Now

(html code ends)

(script code below)

&ltscript&gt

!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version='1.0',e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,'script','https://www.exploretock.com/tock.js');

tock('init', 'drakes-brewing-dealership-oakland');

tock('init', 'drakesbarn');

&lt/script&gt


!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version=’1.0′,e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,’script’,’https://www.exploretock.com/tock.js’);

tock(‘init’, ‘drakes-brewing-dealership-oakland’);

tock(‘init’, ‘drakesbarn’);

(script code ends)

You will need to place the following lines of code in their respective locations of the BODY to display where you would like on the website.

BODY code:
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gtDealership&lt/a&gt doesn’t work
Dealership

&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gtThe Barn&lt/a&gt works
The Barn

(html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle&gtTock Button&lt/title&gt
&ltstyle&gt
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt
&lt!-- button does not work --&gt

&lt/body&gt
&lt/html&gt


.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

Book Now

(html code ends)
(html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle>Tock Button&lt/title&gt
&ltstyle&gt
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt
&lt!-- button works --&gt

&lt/body&gt
&lt/html&gt


.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

Book Now

(html code ends)

Revised 24.4.3 3:10PM

After inspecting your coding we see that the current HEAD code is missing the ‘init’ statement for the Dealership location which is why that button is not working. However, further down in the BODY of also have another copy of the HEAD code that is correct. Moving this line up to the HEAD section will also have the button functioning properly. Original Head code was &ltscript&gt
!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version='1.0',e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,'script','https://www.exploretock.com/tock.js');
tock('init', 'drakes-brewing-dealership-oakland');
tock('init', 'drakesbarn');
&lt/script&gt
(updated html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle>Tock Button&lt/title&gt
&ltstyle&gt
/* Remove default margin and padding */
body, html {
margin: 0;
padding: 0;
}
/* Apply styles to the button */
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 10px 20px; /* Adjust padding as needed */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&ltscript&gt
!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version='1.0',e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,'script','https://www.exploretock.com/tock.js');

// Initialize Tock for "drakes-brewing-dealership-oakland"
tock('init', 'drakes-brewing-dealership-oakland');
// Initialize Tock for "drakesbarn"
tock('init', 'drakesbarn');
&lt/script&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt
&lt!-- Button works --&gt
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt
&lt!-- Button doesn't work --&gt

&lt/body&gt
&lt/html&gt

/* Remove default margin and padding */
body, html {
margin: 0;
padding: 0;
}
/* Apply styles to the button */
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 10px 20px; /* Adjust padding as needed */
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version=’1.0′,e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,’script’,’https://www.exploretock.com/tock.js’);

// Initialize Tock for “drakes-brewing-dealership-oakland”
tock(‘init’, ‘drakes-brewing-dealership-oakland’);
// Initialize Tock for “drakesbarn”
tock(‘init’, ‘drakesbarn’);

Book Now
Book Now

(html code ends)

Revised 24.4.3 3:30PM

(html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltscript&gt
!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version='1.0',e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,'script','https://www.exploretock.com/tock.js');
tock('init', 'drakes-brewing-dealership-oakland');
tock('init', 'drakesbarn');
&lt/script&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle&gtTock Button&lt/title&gt
&ltstyle&gt
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtThe Barn&lt/button&gt&lt/a&gt
&lta href="https://www.exploretock.com/drakes-brewing-dealership-oakland" data-tock-business="drakes-brewing-dealership-oakland" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtDealership&lt/button&gt&lt/a&gt

&lt/body&gt
&lt/html&gt


!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version=’1.0′,e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,’script’,’https://www.exploretock.com/tock.js’);

tock(‘init’, ‘drakes-brewing-dealership-oakland’);

tock(‘init’, ‘drakesbarn’);

.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

Book Now

(html code ends)
(html code below)

&lt!DOCTYPE html&gt
&lthtml lang="en"&gt
&lthead&gt
&ltmeta charset="UTF-8"&gt
&ltmeta name="viewport" content="width=device-width, initial-scale=1.0"&gt
&lttitle>Tock Button&lt/title&gt
&ltstyle&gt
.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}
&lt/style&gt
&lt/head&gt
&ltbody&gt

&lt!-- Tock Button wrapped inside an anchor tag --&gt
&lta href="https://www.exploretock.com/drakesbarn" data-tock-business="drakesbarn" data-tock-reserve=true&gt&ltbutton class="tock-button"&gtBook Now&lt/button&gt&lt/a&gt
&lt!-- button works --&gt

&lt/body&gt
&lt/html&gt


!function(t,o,c,k){if(!t.tock){var e=t.tock=function(){e.callMethod? e.callMethod.apply(e,arguments):e.queue.push(arguments)};t._tock||(t._tock=e), e.push=e,e.loaded=!0,e.version=’1.0′,e.queue=[];var f=o.createElement(c);f.async=!0, f.src=k;var g=o.getElementsByTagName(c)[0];g.parentNode.insertBefore(f,g)}}( window,document,’script’,’https://www.exploretock.com/tock.js’);
tock(‘init’, ‘drakes-brewing-dealership-oakland’);
tock(‘init’, ‘drakesbarn’);

.tock-button {
background-color: #3E6AEF; /* You can customize the background color here */
border: none;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 50px; /* You can adjust the border-radius to change the shape */
}

The Barn
Dealership

(html code ends)