skip to Main Content

Styling the Cart Page Elements

While this plugin adds several unique stylesheet classes for customization, by default very little CSS is added. Some themes may have additional styling that transforms its appearance already. Others may be more simple leaving you with some boring details. In this example, we are using the StoreFront theme from WooCommerce. It is a great theme, but leaves the extra details up to you and your shop preference.

“Save for Later” Link

In this case, the “Save for Later” link is a simple hyperlink. It is not exactly the most attractive piece here and won’t attract much attention for your buyers.

With a little bit of CSS, we can style this button to have more of a presence and to match the theme colors we have already chosen for our shop. The code below transforms the hyperlink to more of a button appearance. It adds a background color, some extra spacing, and rounded corners for extra appeal.

.woocommerce .cart .bes4l_save_link { 
  padding: 6px 10px; 
  background: #93bf53; 
  color: #fff; 
  border-radius: 3px;
}

  • Was this article helpful ?
  • yesno
0 out of 0 visitors found this article helpful
Views: 21
Back To Top