How to add a Hyperlink to JSON file?

Solved

How to add a Hyperlink to JSON file?

Fredautoparts
Tourist
8 1 1

I have this button coded into my theme.liquid, but the problem is that it won't show up on every page because some pages are templates from a third-party app called Gempages. They use a .Json file so I wanna add a hyperlink into the bottom of every one of those pages. I only know how to use HTML so please help me out.

 

The button:

<a href="#" class="order-btn button">Place Order</a>

Screenshot 2024-07-11 103123.png

 

 

 

 

And a question, this will use the CSS properties I already have set up right?

Accepted Solution (1)

Fredautoparts
Tourist
8 1 1

This is an accepted solution.

I figured it out.

Go to customize store, go to the page, and click add custom liquid. It's that simple. Make the padding for top and bottom both 0 and you'll have a permanent floating button.

View solution in original post

Replies 4 (4)

eba-tech
Shopify Partner
17 0 8

Hi @Fredautoparts ,

 

It's hard to say without more info and examples of the json files and how the templates are used to construct them (I am unfamiliar with Gempages).

I'm not quite sure what you're trying to achieve, are you saying the buttons are already in place but you just need to add the hyperlink to href? Are these buttons are already place on the Gempages templates?

Fredautoparts
Tourist
8 1 1

Sorry for being vague. So basically, Gempages is a Shopify app that lets you design your store to look beautiful very easily. But, the code that comes out is AI-generated (Doesn't really matter because I'm adding a button at the bottom of the code) + it's in .Json formatting so it's very confusing to edit. About the button - I've added a hyperlink block to the theme.liquid of my Shopify store that will appear on any Shopify template (Search results, collections, and homepage, but not new pages I've used Gempages template from). Also, I have already customized this button to match the Gempages theme in the base.css. But the Gempages template aren't directly connected to the theme.liquid for my store. So I would have to manually add a hyperlink with the same class to the Gempages code. But again, I have no idea how to use .Json so that's where I get stuck. Because in .Json it's differant than <a> ___________ </a> and it gives a bunch of errors.

 

*Note: I design from Gempages and replace the Shopify templates with the Gempages ones, which is why it's not showing up.

 

These are what the Gempages templates look like:

Screenshot 2024-07-11 113443.png

-------------------------------------------------------------

 

Screenshot 2024-07-11 113547.png

I want to add the code here ^^^ at the bottom, separate from the AI-generated code.

eba-tech
Shopify Partner
17 0 8

Hey @Fredautoparts , just saw this now, glad you found a solution!

Fredautoparts
Tourist
8 1 1

This is an accepted solution.

I figured it out.

Go to customize store, go to the page, and click add custom liquid. It's that simple. Make the padding for top and bottom both 0 and you'll have a permanent floating button.