Buttons

I would like to make all of my buttons round. When you add a button you can select to make it round. On my home page I have set it to be so under the Echo Church App section. However under the Blog section that was added the Load More button defaults to a square button. Is there way to make all of my buttons to default to a round button? Is there a place to adjust colors as well?

Hello,

Here is a code snippet to make all buttons round

.added_to_cart, 
.button, 
button, 
input[type=submit],
.yith-woocompare-widget a.button.compare,
.single-product-content .cart .button,
.woocommerce .cart-actions .coupon .button,
.added_to_cart.btn-color-black, 
input[type=submit].btn-color-black,
.wishlist_table tr td.product-add-to-cart>.add_to_cart.button,
.basel-hover-quick .quick-shop-btn > a,
table.compare-list tr.add-to-cart td a,
.added_to_cart.btn-color-primary, 
.btn.btn-color-primary,
 .button.btn-color-primary, 
 button.btn-color-primary, 
 input[type=submit].btn-color-primary,
.widget_shopping_cart .buttons .checkout,
.widget_shopping_cart .widget_shopping_cart_content .buttons .checkout,
.woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a,
.woocommerce-checkout .place-order input[type=submit],
.woocommerce-checkout .checkout_coupon .button,
.woocommerce input[name=save_account_details], 
.woocommerce input[name=save_address], 
.woocommerce input[name=track], 
.woocommerce-page input[name=save_account_details], 
.woocommerce-page input[name=save_address], 
.woocommerce-page input[name=track],
.woocommerce .return-to-shop .button,
.basel-navigation .menu > li.callto-btn > a,
.basel-hover-standard .btn-add > a,
.basel-hover-excerpt .btn-add a,
.basel-hover-quick .woocommerce-variation-add-to-cart .button,
.basel-search-dropdown .basel-search-wrapper .basel-search-inner form button,
.error404 .page-content>.searchform #searchsubmit,
.basel-info-box.box-style-border .info-btn-wrapper a, 
.basel-info-box2.box-style-border .info-btn-wrapper a,
.basel-price-table .basel-plan-footer>a,
.blog-footer .basel-blog-load-more, 
.blog-footer .basel-portfolio-load-more, 
.blog-footer .basel-products-load-more, 
.portfolio-footer .basel-blog-load-more, 
.portfolio-footer .basel-portfolio-load-more, 
.portfolio-footer .basel-products-load-more, 
.products-footer .basel-blog-load-more, 
.products-footer .basel-portfolio-load-more, 
.products-footer .basel-products-load-more {
	border-radius: 35px;
}

Regards

Were do I add this?

To the Custom CSS section in Theme Settings.

It did not change the bottoms to round. I was wanting to change the load more button on http://shawngray.tv and the button on the footer. Neither changed.

But you even didn’t insert the code to the Custom CSS.

I went to dashboard / Themes Settings / General / Custom CSS / And pasted it in Global Custom CSS.
I’m not sure why you aren’t seeing it if you aren’t seeing it.

It was an error in the code you added before. We have fixed it. Please check now.

Wow. Your customer support and the template is out of this world. Amazing.

We are glad that you like it 🙂

Regards

[Author]

Posts