[Skip to main content](#vessel-content)

#   Checkout page to become more visually compact

##

- **[guro](/forum/user/35365-guro "View guro's Profile")**
- [![guro's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/35365-guro "View guro's Profile") Topic Author
- [ Offline](/forum/user/35365-guro)

Less More

- Posts: 41
- Thank you received: 2
-
-

1 year 9 months ago [\#365535](#365535) by [guro](/forum/user/35365-guro "View guro's Profile")  *[Checkout page to become more visually compact](/forum/27-checkout/909107-checkout-page-to-become-more-visually-compact#365535 "-- HikaShop version -- : 5.0.3 -- Joomla version -- : 4.4.3 -- PHP version -- : 8.1  HI,  I would like to modify the checkout page to become more visually compact like a shopify page - I don't want to change the order of things like shopify. I have attached to you two images, one of my hikashop site and one from shopify.  May you can give me some suggestions in CSS? At the moment it is so spread out it is a little unpleasant.  Best regards, Dimitris")* was created by *[guro](/forum/user/35365-guro "View guro's Profile")*

-- HikaShop version -- : 5.0.3
-- Joomla version -- : 4.4.3
-- PHP version -- : 8.1

HI,

I would like to modify the checkout page to become more visually compact like a shopify page - I don't want to change the order of things like shopify. I have attached to you two images, one of my hikashop site and one from shopify.

May you can give me some suggestions in CSS? At the moment it is so spread out it is a little unpleasant.

Best regards,
Dimitris

- [ ![shopify.png](/forum/attachment/60201) ](/forum/attachment/60201 "shopify.png") [ ](/forum/attachment/60201?download=1 "shopify.png")
- [ ![hikashop.png](/forum/attachment/60202) ](/forum/attachment/60202 "hikashop.png") [ ](/forum/attachment/60202?download=1 "hikashop.png")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI3LWNoZWNrb3V0LzkwOTEwNy1jaGVja291dC1wYWdlLXRvLWJlY29tZS1tb3JlLXZpc3VhbGx5LWNvbXBhY3Q/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png?1793428657)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Offline](/forum/user/63-nicolas)

Less More

- Posts: 86358
- Thank you received: 14293
-
-

1 year 9 months ago [\#365536](#365536) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Checkout page to become more visually compact](/forum/27-checkout/909107-checkout-page-to-become-more-visually-compact#365536 "-- HikaShop version -- : 5.0.3 -- Joomla version -- : 4.4.3 -- PHP version -- : 8.1  HI,  I would like to modify the checkout page to become more visually compact like a shopify page - I don't want to change the order of things like shopify. I have attached to you two images, one of my hikashop site and one from shopify.  May you can give me some suggestions in CSS? At the moment it is so spread out it is a little unpleasant.  Best regards, Dimitris")*

Hi,

You can restrict the width available to make it more compact: Code:

div#hikashop_checkout { max-width: 600px; margin: auto; } .hikashop_checkout_login .hkc-lg-8 { width: 100%; } .hikashop_checkout_login .hkc-lg-4 { width: 350px; margin: auto; }

This results in this:
[ imgur.com/a/Vo3c1UM](https://imgur.com/a/Vo3c1UM)

The following user(s) said Thank You: [guro](/forum/user/35365-guro "View guro's Profile")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI3LWNoZWNrb3V0LzkwOTEwNy1jaGVja291dC1wYWdlLXRvLWJlY29tZS1tb3JlLXZpc3VhbGx5LWNvbXBhY3Q/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

Board Categories HikaShop Install &amp; Update Product &amp; Category Display Content Creation Sales and Orders Orders management Reports &amp; Statistics Customers Checkout Payment Methods Shipping Methods Import &amp; Export (CSV, XLS…) Specific Features Affilation Taxes Wishlist Vote Carousel &amp; Slider Mass Actions Filters &amp; Search Discount &amp; Coupon Feature Request Integrations Showcase General Talk about HikaShop Development HikaShop 3.0 Beta Translation Commercial Jobs HikaShop Components HikaMarket Market: Feature requests Market: How to? Market: Bug Report HikaSerial General talk about HikaSerial Serial: Bug Report Serial: How to? Support en Français de HikaSerial (French Support) HikaSubscription HikaAuction Auction: Feature requests Auction: How to? Auction: Bug report Hikashop around the world Support en Français (French Support) Russian FAQ. Курс выживания с Hikashop. Частые вопросы и о Расширения Hikashop Наши сайты на Hikashop 日本語版サポート(Japanese Support) Thai German Archives Bug Report How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.041 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)
