[Skip to main content](#vessel-content) # Adding Fontawesome Icons? ## - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago - 11 years 6 months ago [\#198596](#198596) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#198596 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* was created by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* -- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: Code: <i class="fa fa-arrow-right"></i> What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush: Last edit: 11 years 6 months ago by [Jethro](/forum/user/36009-jethro "View Jethro's Profile"). Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) 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) - 11 years 6 months ago [\#198597](#198597) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#198597 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi, Depending where you want to put the icon, you can use a view override (like "checkout | step") or a translation override. More about the HikaShop customization: [ www.hikashop.com/support/support/documen...ize-the-display.html](https://www.hikashop.com/support/support/documentation/153-customize-the-display.html) Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#198710](#198710) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#198710 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Worked a charm! Many Thanks! Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#198750](#198750) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#198750 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* So a quick question again, I want to add the following icon to my "add to cart" button on my product page... <i class="fa fa-plus-square"></i> Using FireBug, how to I know which view to edit, and how do I know where to inject the code? Many thanks, Jethro. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) 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) - 11 years 6 months ago [\#198776](#198776) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#198776 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi, You can use the documentation that I gave you in my previous message. See below in the page for the product page description [ www.hikashop.com/support/support/documen...-display.html#layout](https://www.hikashop.com/support/support/documentation/153-customize-the-display.html#layout) Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#199646](#199646) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199646 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi there, thanks for the help! So I added the code: <p class=fa fa-arrow-circle-right></p> to the language override in the Hikashop asked and it does not show correctly, see the screenshot below: [ ![1_2015-04-22.png](/forum/attachment/23999) ](/forum/attachment/23999 "1_2015-04-22.png") Where am I going wrong? :blush: - [ ![1_2015-04-22.png](/forum/attachment/23999) ](/forum/attachment/23999 "1_2015-04-22.png") [ ](/forum/attachment/23999?download=1 "1_2015-04-22.png") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) 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) - 11 years 6 months ago [\#199661](#199661) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199661 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi, Without a link to a page or more details about what that "checkout" is exactly ; it will be difficult to help you correctly. Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#199696](#199696) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199696 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi that is the Hikashop Checkout Module, you can see it in our store: [ www.smart-drones.com/store](http://www.smart-drones.com/store) . Many thanks, Jethro. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199722](#199722) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199722 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* **link to css file** did you add the link to css file that define location of font library ( otf .ttf svg .....) in index.php file add in the <head> this code :oops: <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">. **define library** @font-face{ font-family:'gzipper'; src: url('gzipperblot.eot'); } **initiate library** iconic { font-family: gzipper , Helvetica, Arial, sans-serif; } **call the glyph** <span class="iconic " data-glyph="microphone"> .iconic[data-glyph="microphone"]:before {     content: ""; } Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#199723](#199723) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199723 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Thanks for the response! This really has me scratching my head... The CSS file should be linked fine as font awesome is working just perfectly on the rest of my site, in addition font-awesome is integrated into my template (T3 Bootstrap) so it should work. Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199724](#199724) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199724 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi In you actual code there of the page there is no selector ( fa-*) that call font awesome ! Take care that checkout is not a **text content** but show/mange by the <input> html tag !! I see that css file fontawesome is load ( OK basic ) Does the custom layout override is really load ? #### Attachment not found Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#199726](#199726) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199726 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* I really appreciate the time you took to help me, Here is what I have done. 1 - Gone to the language override section in configuration in the Hikashop backend and added the code: <i class="fa fa-arrow-circle-right"></i> to the field PROCEED_TO_CHECKOUT= So it looks like this: Code: PROCEED_TO_CHECKOUT="Checkout <i class="fa fa-arrow-circle-right"></i>" This is how it looks in my backend: [ ![1_2015-04-23.png](/forum/attachment/24037) ](/forum/attachment/24037 "1_2015-04-23.png") However it still fails and shows the code in the checkout button... [ ![2_2015-04-23.png](/forum/attachment/24038) ](/forum/attachment/24038 "2_2015-04-23.png") It should not be a complicated thing, you can even see on my home page and in the menu I am using fontawesome all over. Very confusing, :whistle: - [ ![1_2015-04-23.png](/forum/attachment/24037) ](/forum/attachment/24037 "1_2015-04-23.png") [ ](/forum/attachment/24037?download=1 "1_2015-04-23.png") - [ ![2_2015-04-23.png](/forum/attachment/24038) ](/forum/attachment/24038 "2_2015-04-23.png") [ ](/forum/attachment/24038?download=1 "2_2015-04-23.png") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago [\#199728](#199728) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199728 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* > lionel75 wrote: Hi > In you actual code there of the page there is no selector ( fa-\*) that call font awesome ! > > Take care that checkout is not a **text content** but show/mange by the <input> html tag !! > > I see that css file fontawesome is load ( OK basic ) > > Does the custom layout override is really load ? > > #### Attachment not found The error should be showing on the cart now if you look again. It would be great if Hikashop was integrated with fontawesome out of the box! Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199729](#199729) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199729 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* you don't understand the concept of content DOM and dynamic tag with atrribute . you CAN' T use translation in the way you do because the string checkout is the value of a arrtibute name call value in < input value = "checkout " > </input> . The brower take this text like raw text and show it without compute it /add it in the node of <input > . you should put the translation value not inside <input value ="here" ></input > but rather <input value="" > here</input>. In web design what you see can be implemented in many way !!! you have to edit the php file and change the location where your translation string is call put it in hte green location . #### Attachment not found The browser understand/show manage data after build a DOM ( memory structure of document where all tag define a node and node contain node . the content in value="" ll be never a node. Try to select the string ""Checkout <i class=fa fa-arrow-circle-right></i>"" you can't so this text is not real text it a kind of shadow text : you see it but you can't select it !!!!! . See the capture screen ; in the code source you don't see the value beetween/inside <input >here </input> but you see in the html page ...... ( to be dig ...... by yourself ) . hope this ll help ( i think yes ) Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199734](#199734) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199734 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* The way the page is show ( you call it an error ) is not an error and is the way it should renderer but it show you don't understand HTML . Support fontawesome by hikashop is not the way to resolve your problem . there is many free font and fontawesome is only one among hunderd . Hikashop could not support too many thing ( they do a lot of work in php and also in csshtml js side ) . The problem is about how you understand master CSS HTML JS . Any developper should hire a web designer to have the look and feel they want . In CMS many buy a template ( it is the way to use CMS and very easy efficient ) but you ll not know howto custom them outside the joomla GUI backend click logic when a technical problem occur. Template don't come with one look and feel design but also with options to custom template like Dreamweaver but with predefine option specific to their template ! The people who create the template know the code logic ........ even it take time try to understand the example i give in my first post .iconic[data-glyph="microphone"]:before { content: ""; } what mean the value after content ? ( attach to pseudo element = virtual ghost data ) what mean :before ? ( pseudo element ) what mean data-glyph ( html 5 concept name data- ) do i need a script to manage HTML5 data- ? Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) 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) - 11 years 6 months ago [\#199738](#199738) by [Jerome](/forum/user/80-jerome "View Jerome's Profile") Replied by *[Jerome](/forum/user/80-jerome "View Jerome's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199738 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* O_o You can't add HTML code in an attribute of an HTML tag ; the checkout button is a button and you can put some HTML in the "value" of the button. So if you use normal buttons (as it is the case on your website), you can't use a translation override. It would be possible if you changed the "button style" option of the HikaShop configuration to "CSS" instead of "normal". But in that case, that also means that you would have to adapt the CSS of the buttons so that they display again like you want. Regards, --- Jerome - Obsidev.com HikaMarket & HikaSerial developer / HikaShop core dev team. The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago - 11 years 6 months ago [\#199750](#199750) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199750 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Phew! This is more complicated than I thought it would be! Got my brain sweating... :woohoo: Thanks Lionel, your in-depth explanations are extremely helpful, it looks like I need to learn some PHP to resolve this issue. EDIT: Jerome! Your solution was extraordinarily useful and ultimately helped me resolve my issues. Just to confirm: Changing the button display to CSS wont cause any problems? Is there a major difference between the two options or any problems I might have? **For those struggling with something similar here are the steps I took:** 1 - I changed the button display setting in configuration/display to "CSS" this removed all of my css changes for the buttons. 2 - Next I re-styled all the buttons to look how I wanted them to 3 - Next I went to the language overrides and added the Fontawesome icons to the language override section. Be sure to use single brackets 'example' instead of double brackets "example". This is how the edits looked in my en-GB language override: Code: ADD_TO_CART='<i class="fa fa-shopping-cart"></i> Add to cart' And that is that! All icons working like a charm... feel free to take a look: [ www.smart-drones.com/store](http://www.smart-drones.com/store) 10/10 support guys, thanks! Last edit: 11 years 6 months ago by [Jethro](/forum/user/36009-jethro "View Jethro's Profile"). The following user(s) said Thank You: [Jerome](/forum/user/80-jerome "View Jerome's Profile"), [dilum\_tharaka](/forum/user/37297-dilum-tharaka "View dilum_tharaka's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199756](#199756) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199756 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* The translation file is for translate content not add style or html markup !!. Nothing is difficult when understand what we do but click on hks button BE don't let us understand what occur on the code source !! If all work it is ok nobody ( consumer) ll look at the code source !! Here the wysiwyg and code source after change Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[Jethro](/forum/user/36009-jethro "View Jethro's Profile")** - [![Jethro's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/gallery/blue_hikashop_heart.png)](/forum/user/36009-jethro "View Jethro's Profile") Topic Author - [ Offline](/forum/user/36009-jethro) - Loving Joomla! Less More - Posts: 37 - Thank you received: 5 - - - - [](http://www.smart-drones.com) - 11 years 6 months ago - 11 years 6 months ago [\#199757](#199757) by [Jethro](/forum/user/36009-jethro "View Jethro's Profile") Replied by *[Jethro](/forum/user/36009-jethro "View Jethro's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199757 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Hi there! Please forgive me I do not quite understand... is this a problem? Last edit: 11 years 6 months ago by [Jethro](/forum/user/36009-jethro "View Jethro's Profile"). Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. - **[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")** - [![lionel75's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/11856-lionel75 "View lionel75's Profile") - [ Offline](/forum/user/11856-lionel75) Less More - Posts: 846 - Thank you received: 92 - - 11 years 6 months ago - 11 years 6 months ago [\#199759](#199759) by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile") Replied by *[lionel75](/forum/user/11856-lionel75 "View lionel75's Profile")* on topic *[Adding Fontawesome Icons?](/forum/26-product-category-display/876375-adding-fontawesome-icons#199759 "-- HikaShop version -- : 2.4.0 Hi there, Is it possible to use font awesome icons in Hikashop, for example to add an Icon to the checkout button: What is the best way to implement this? Best regards, Jethro. EDIT: :blush: So sorry for posting this in the wrong category! Should go in the Display Category. :blush:")* Not really because you done it like that so you know that for change/update the code you have to go to the translation file. if a people who translate site has to create different language version ; he ll not understand why there is <i> and class selector in the translation file and he could replace all the string by the translation of "add card" in french " ajouter au panier". my way I think better is to put the html tag and class in the layout . Layout view contain look and feel , icon are for look and feel ................theme .......In a way font icon don't have to be translate . icon font are international language !!! hks way seem they manage the issue you have by hks BE option so i can't say nothing about the way they implement it . it work ...so all is ok ... the site use joomla template [ purity iii ](http://www.joomlart.com/joomla/templates/purity-iii) regard's (NB i don't really resolve my joomla date issue today ) Last edit: 11 years 6 months ago by [lionel75](/forum/user/11856-lionel75 "View lionel75's Profile"). The following user(s) said Thank You: [Jethro](/forum/user/36009-jethro "View Jethro's Profile"), [tesla](/forum/user/40372-tesla "View tesla's Profile") Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzI2LXByb2R1Y3QtY2F0ZWdvcnktZGlzcGxheS84NzYzNzUtYWRkaW5nLWZvbnRhd2Vzb21lLWljb25zP3RtcGw9bWFya2Rvd24=) or [Create an account](/component/users/registration?Itemid=101) to join the conversation. Board Categories HikaShop- Install & Update- Product & Category Display- Content Creation- Sales and Orders- - Orders management- - Reports & Statistics- Customers- Checkout- Payment Methods- Shipping Methods- Import & Export (CSV, XLS…)- Specific Features- - Affilation- - Taxes- - Wishlist- - Vote- - Carousel & Slider- - Mass Actions- - Filters & Search- - Discount & 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.550 seconds [Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org) [](#top)