Menu

How do I move my Buy Button so it isn't in the top of the page?

(Note: This is for Theme versions 1.9.9 and below!)

Thinkific presents your landing page to a visitor by finding and assembling the various parts of it. It has a set of instructions do this in your site's Theme.


You can change your site's Theme to include the buy button after your course description and before your course instructor profile by doing the following:


  1. In the Admin Dashboard, go to Themes.
  2. Select the My Themes button. Under the 'Active Theme' select the Edit HTML/CSS button.
  3. In the Theme Editor, on the left, expand 'Course Landing Pages'.
  4. Select 'Add New Course Landing Page'. Name it.
  5. Find '{% include "course_landing_page_action_buttons" %}' and remove it from the code.
  6. Find the space before '{% comment %} Display the course instructor {% endcomment %}' and paste the following code in there:

    <div style="padding-bottom:2em;" class='product-main-cta'>
         {% include "course_landing_page_action_buttons" %}
    </div>

  7. Go to File > Save.
  8. Go to My Courses in the Admin Dashboard, and open your course.
  9. Go to the Landing Page Tab.
  10. Change the landing page to the one you have just created.
  11. Save the changes and preview the page.

Now you'll have a Custom Landing Page that can be applied to all of your courses through the Design tab of your course creator.


Now you can also stop at step 6 above, and add your course button to the course description directly as HTML:

  1. Follow these steps to get your course's enroll button's target URL.
  2. Go to My Courses and then open your course.
  3. Go to the Details tab to edit the Course Description.
  4. In the Editor Toolbar, select the '<>' button to see the HTML markup.
  5. After your course description markup ends, add the following:

    <div class="product-main-cta" style="text-align:center;padding-top:1em;padding-bottom:2em;">

    <a href="[Course Enroll URL]" class="btn btn-primary btn-purchase btn-lg">[Button Text]</a>

    </div>

  6. Where the HTML says '[Button Text]' change this to whatever CTA you want (e.g. Get Started).
  7. Where the HTML says '[Course Enroll URL]' change this to your button's target URL copied earlier in step 1.
  8. Save the page.


1 person has this question

Can I customize the location of the "resume course" button? I'd rather have the button lower/center on the banner so I can keep my design and none of the themes have this option... Thanks.

Hi Renita!


You can still follow the instructions above but for step 6, you would past the code into the space before  {% comment %} Display the course description {% endcomment %}


If you're having problems with this, send us a quick message through this link: http://help.thinkific.com/support/tickets/new


Thanks!


Oliver

Hi! 


I have created a new banner in the "add new section" area (inside edit theme)... but when I later on want to use it, inside my page builder, it does not appear as an option when I click on "add section". How could I solve this?

My aim was to have an additional banner without any buttons (my other banners / landing pages do have and need buttons). 


Thanks for your help!


Hi Patrick!


Send us a message to http://help.thinkific.com/support/tickets/new and we can take a look for you. 

It's difficult to know what theme version a course is using. My site has the default theme 1.9.0, but does that mean the theme I picked for the course is also 1.9.0? The theme I'm using is called Video Course Landing Page, but I don't see a number for it. Thanks!

Hi David!


That is a great question and hope I can shed some light here!


With the older version of Themes (pre 2.x) there would be 3 different styles that are considered part of the Default Theme - including the Default Course Landing Page, Video Course Landing Page and Curriculum Course Landing Page - which would show as Default Theme 1.9 when you view Manage My Themes. There are then the additional individual Theme styles such as Mountain, Onyx in that version.


So for you, within the course, you might have one of those three specifically applied and they would be part of Default Theme 1.9


That being said, this is a bit changed now with v2 of the Themes and you no longer set a different theme per course and there is not really a Default Theme. In addition to just a new overall look, the new Themes also include the Page Builder which make customizations much easier with less HTML! If you would like, please send us an email or ticket and we can get you upgraded! (or you can always view this article - Upgrade to the New Page Builder with Version2 Themes!


1 person likes this

Thanks Eric! 


So as far as moving the Buy button farther down the page, can that be done without dealing with code in the v2 themes and the Page Builder?


Also, I'd like to change the word "Buy" on the button to another word or short phrase. Can that be done, either in the v1 or v2 themes?

Hi David!


I'll provide a bit of detail here for the discussion forum however it may be easiest to send us a ticket directly and then we can assist one-to-one!


The Buy Button(s) within the Banner section itself would need to be modified within the Theme Editor itself (both v1 and v2)

However throughout the rest of the page, any buttons are placed as part of Call to Action sections in the Page Builder (v2) and as such, you can edit for placement, texting etc.



Login to post a comment