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

#   Use login/register/next buttons on checkout page

##

- **[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")**
- [![jcwerb's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar4458.jpg)](/forum/user/4458-jcwerb "View jcwerb's Profile") Topic Author
- [ Offline](/forum/user/4458-jcwerb)

Less More

- Posts: 33
- Thank you received: 0
-
-

14 years 7 months ago [\#45140](#45140) by [jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")  *[Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45140 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")* was created by *[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")*

Hi Nicolas,

One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.

In the language file I added the image source like this:

HIKA_LOGIN="Login&lt;img src='../idesigntest/images/login.jpg'/&gt;"

But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?

I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.

Thank you very much,
Johanna

- [ ![screenshot-buttons.jpg](/forum/attachment/3297) ](/forum/attachment/3297 "...ot-buttons.jpg") [ ](/forum/attachment/3297?download=1 "...ot-buttons.jpg")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) 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")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86323
- Thank you received: 14283
-
-

14 years 7 months ago [\#45346](#45346) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45346 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

You can do that, but in that case, you will have to change the "button style" option to "CSS" instead of "Normal" in the Display tab of the configuration.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")**
- [![jcwerb's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar4458.jpg)](/forum/user/4458-jcwerb "View jcwerb's Profile") Topic Author
- [ Offline](/forum/user/4458-jcwerb)

Less More

- Posts: 33
- Thank you received: 0
-
-

14 years 7 months ago [\#45415](#45415) by [jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")  Replied by *[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45415 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

Hi Nicolas,

Thank you for your reply, but I already have 'css' set in the 'display' of the configuration because I use css buttons to display 'add to cart' on the product pages.

Any other way of doing this?

Thank you!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) 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")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86323
- Thank you received: 14283
-
-

14 years 7 months ago [\#45422](#45422) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45422 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

Then why not just just CSS to replace your buttons by images like we did on our demo website ?

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")**
- [![jcwerb's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar4458.jpg)](/forum/user/4458-jcwerb "View jcwerb's Profile") Topic Author
- [ Offline](/forum/user/4458-jcwerb)

Less More

- Posts: 33
- Thank you received: 0
-
-

14 years 7 months ago [\#45430](#45430) by [jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")  Replied by *[jcwerb](/forum/user/4458-jcwerb "View jcwerb's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45430 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

Hi Nicolas,

I've been trying that, but the class for the 'login', 'register' and 'next' text is hikashop_cart_button, just like the 'add to cart' button which I have. I need to add further css I realize, but am stuck with that. Can you please give me some pointers? Sorry for being a bit dim and wasting your time on something which is probably quite simple for you.

Thank you!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) 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")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86323
- Thank you received: 14283
-
-

14 years 7 months ago [\#45535](#45535) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#45535 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

for the login button, you can use such CSS:
.hikashop_checkout_login_left_part .button{
background-image: url('[ mywebsite.com/myimage.png](http://mywebsite.com/myimage.png)');
}

for the register button, you can use such CSS:
.hikashop_checkout_login_right_part .button{
background-image: url('[ mywebsite.com/myimage.png](http://mywebsite.com/myimage.png)');
}

for the next button, you can use such CSS:
\#hikashop_checkout_next_button{
background-image: url('[ mywebsite.com/myimage.png](http://mywebsite.com/myimage.png)');
}

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

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[cristianciocoi](/forum/user/10712-cristianciocoi "View cristianciocoi's Profile")**
- [![cristianciocoi's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar_2012-11-28.png)](/forum/user/10712-cristianciocoi "View cristianciocoi's Profile")
- [ Offline](/forum/user/10712-cristianciocoi)

Less More

- Posts: 12
- Thank you received: 0
-
-
-
- [](http://gifter.ro)
-

13 years 11 months ago [\#79294](#79294) by [cristianciocoi](/forum/user/10712-cristianciocoi "View cristianciocoi's Profile")  Replied by *[cristianciocoi](/forum/user/10712-cristianciocoi "View cristianciocoi's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#79294 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

Hi Nicolas, I used the code you wrote but my login/register/next buttons are still the same with my add to cart buttons.

mysite: [ gifter.ro](http://gifter.ro)

Thank you!

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) to join the conversation.

- **[Jerome](/forum/user/80-jerome "View Jerome's Profile")**
- [![Jerome's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar80.png)](/forum/user/80-jerome "View Jerome's Profile")
- [ Offline](/forum/user/80-jerome)
- HikaShop core developer

Less More

- Posts: 26394
- Thank you received: 4078
-
- [](http://obsi.dev)
-

13 years 11 months ago [\#79326](#79326) by [Jerome](/forum/user/80-jerome "View Jerome's Profile")  Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Re: Use login/register/next buttons on checkout page](/forum/4-how-to/45140-use-login-register-next-buttons-on-checkout-page#79326 "Hi Nicolas,  One of the last things I'm trying to do on my website is turn the words 'login', 'register' and 'next' on the checkout page into buttons similar to the ones I have for 'add to cart' on the product pages. I've tried doing this via css, but that was unsuccessful, so am now trying to do via the language file. However, I am encountering a few issues and need some help.  In the language file I added the image source like this:  HIKA&#95;LOGIN=&quot;Login&quot;  But then I get the image next to the title of the login box well, please see attached screenshot. How can I make it appear only where folk click to login and then also make it a different image on hover?  I want to do the same thing for 'register' and 'next' also with on:hover images. If you can give me some advice on how to achieve this in Hikashop, I would be most grateful.  Thank you very much, Johanna")*

Hi,

You are not using the same kind of buttons.
Use ".hikashop_cart_button" instead of ".button" in the CSS.

Regards,

---

Jerome - Obsidev.com
HikaMarket &amp; HikaSerial developer / HikaShop core dev team.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzQtaG93LXRvLzQ1MTQwLXVzZS1sb2dpbi1yZWdpc3Rlci1uZXh0LWJ1dHRvbnMtb24tY2hlY2tvdXQtcGFnZT90bXBsPW1hcmtkb3du) or [Create an account](/register) 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.098 seconds

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