Book Now Button Stuck Above Page Designer

I've just created a calendar booking page for an upcoming event. I used page designer to make the page, but the "Book Now" button that is automatically generated is in the top of the page above the photos and text. I would like it to be at the bottom. Can you please help me figure this out? Thank you!

Edited Fri Nov 01, 19 10:58 AM by Erica White

Has anyone else had this issue? I need to fix it ASAP

Edited by

Go to Design -> Page Display & Content Listing Layouts

Under Page Listing Layouts click Booking Services Page and replace the HTML code there with this:

<div id="storePage">
<div class="photos nofloatsmall">
<div class="inner"><?php pagePhotos(); ?></div>
</div>
<div class="content nofloatsmall">
<div class="inner">
<div class="title"><h1><?php pageTitle(); ?></h1></div>
<div class="share"><?php socialShare();?></div>
<div><span onclick="showbookingcalendar('<?php print MD5($date['date_id']);?>'); return false;" class="addtocart" style="padding: 8px;"><?php print $date['_book_now_'];?></span></div>
<div class="text"><?php pageText(); ?></div>
<div> </div>
</div>
</div>
<div class="clear"></div>
</div>

Edited by

Ok. I tried that for " Booking Services Page" and it didn't work, so I reverted back to the original code. Then tried it for "Booking Services with Book Now Button" and it didn't work there either. Any other ideas?

Edited by

Use this code Under Page Listing Layouts / Booking Services Page. I got it backwards:

<div id="storePage">
<div class="photos nofloatsmall">
<div class="inner"><?php pagePhotos(); ?></div>
</div>
<div class="content nofloatsmall">
<div class="inner">
<div class="title"><h1><?php pageTitle(); ?></h1></div>
<div class="share"><?php socialShare();?></div>
<div class="text"><?php pageText(); ?></div>
<div> </div>
<div><span onclick="showbookingcalendar('<?php print MD5($date['date_id']);?>'); return false;" class="addtocart" style="padding: 8px;"><?php print $date['_book_now_'];?></span></div>
</div>
</div>
<div class="clear"></div>
</div>

Edited by

That didn't work either. The button is still fixed to the top of the page, above the page designer content.

https://ericalindseyphotography.com/minis/holiday-mini-sessions/

Edited by

Wish you would have mentioned you are not using the default layout for the booking page.

How did you add the book now button?

Edited by

I'm not entirely sure what you mean. I am using the default layout, I did all the calendar features through there, but clicked "page designer" to create the page details, as it's much easier/intuitive to use. Your default page automatically adds a book now button. But it's like it thinks it's the only object on the page, since it doesn't mesh with the page designer.

Edited by

I basically need the HTML code to fix the "Book Now" button to the bottom of the page, as well as whether it goes right into the HTML section on that default page, or in a different section. I'm sorry if my wording was confusing. I'm not great with coding, which is why I bought this program :) Thanks!

Edited by

Can I just enter it in the section here?

Edited by

Somewhere along the way you change the layout of the booking calendar pages (the layout that defines how things are displayed).

I assume now you added the book now button code to the text editor for that page (it does not do that on it's own ) as I see where it says book now and assume that is the code you copied from the button code it offers to add to a different page.

Just email me the link to your Sytist admin, the admin username and password (or create me an admin account by clicking Admins in the upper right corner of the admin pages), so I can add the book now button to the bottom of that page. I don't know exactly what was changed.

Edited by

I figured out how to get it fixed to the bottom of the page after googling and trying a bunch of different things. This works, but it kind fades in and out as you scroll down rather than just being at the bottom when you get there. It's not perfect, but it'll do. Thanks

BOOK NOW

edited to say I put the code here but it just changed it to "BOOK NOW" for some reason

Edited Tue Nov 05, 19 6:38 PM by Erica White

Is there a way that I can add it to a button through the page designer?

Edited by

Yes. When editing your booking service in the admin, down the right side click Book Now Button option. Select from inside the first quote to the end of return false; * ... like in the blue area of the attached screenshot.

In the page designer when you are adding the link (add a button to the page), make the URL: javascript: .... then paste what you copied but then remove the return false part.

So the URL will be pretty much like this to add for your link:

javascript:showbookingcalendar('4c22bd444899d3b6047a10b20a2f26db'); return false;

* I say copy through the return false; part because you can't see the entire line there.

Edited by

OMG... thank you so much! It finally looks good and I'm so happy! That was exactly what I needed

Edited by