docs PHP, CSS & JS

Checkout

Oxygen's WooCommerce integration makes it easy to create the checkout page using the Checkout element. This element needs to be added to the page assigned to "Checkout page" via WooCommerce -> Settings -> Advanced.

Add the Checkout element to your page or template by clicking +Add -> WooCommerce -> Checkout.

Background

Style the background color and padding.

  • Background Shadow - style the background shadow.
  • Background Border - style the background border.

Typography

Style the checkout typography.

Inputs

Style the background color, placeholder text color and input padding.

  • Typography - style the input typography.
  • Border - style the input border.
  • Focus Border - style the focused input border.
  • Box Shadow - style the input box shadow.
  • Focus Box Shadow - style the focused input box shadow.

Labels

Style the label typography.

Heading

Style the typography of the headings.

Prices and Quantity

Set the text color, font-family and font size.

Order Background

Set the background color.

  • Background Border - style the order background border.

Secondary Buttons

Set the secondary button background color, hover color and padding.

  • Typography - style the secondary button typography.
  • Border - style the secondary button border.
  • Hover Border - style the secondary button border on hover.

Primary Button

Set the button background color, border color, hover color and padding.

  • Typography - style the button typography.

Info Messages

  • Typography - style the info message typography.
  • Links - style the info message links.

Payment Methods

  • Typography - style the payment method typography.
  • Bubble Box - style the payment method bubble box.

Last modified: June 15, 2021
Copyright © 2024 Soflyy
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram