Morgan Web Development Logo
  • Services
    • Site Creation
    • Digital Marketing
  • Portfolio
Book A Consultation
Morgan Web Development Logo
  • Services
    • Site Creation
    • Digital Marketing
  • Portfolio
Book A Consultation

Building A Website: Part 4

Customizing The Checkout Page

We are finally on the final step of our users buying journey, the checkout page. Go ahead and click the checkout button and let’s see what the page looks like.

checkoutPage

It seems like the top bar and the stars are the only things we need to change, so let’s get to it. 

Start by going to the customize section and inspecting the top element.

checkoutPage2

Looks like it has a class of “woocommerce-info”, so let’s go ahead and add this code to the CSS:

.woocommerce-info{
border-top: 5px solid #000000 !important;
}

checkoutPage3

Next let’s inspect the stars that indicate our required fields. It looks like they have a class of “required’.

checkoutPage4

Add this code to the CSS:

.required{
color: #000000 !important;
}

checkoutPage5

Looks good. Publish the results and check to make sure everything is working. If it all is then we are done and we can move forward to our next section, “Creating The Rest Of Our Content”.

Coming Back To Cart Slider Creating Custom Post Page

Related Posts

Building A Website: Part 5, Course

Building A Website: Part 5, Course

Building A Website: Part 5, Course

Back To Top

Follow Us On Social Media