Importing JSON code

So I am fairly new but I have been reading for days and can not figure this out. I am not sure if I should use shortcodes or Data-driven Content. Anyway I am editing a page inside the content folder which has an extension of .md. I would like to load the data from my .json file to the page. I need to be able to select certain items from the file as well if possible. Below is a section of the json export from mysql and I would appreciate any help anyone can give me or point in the correct direction. I have read the website but find it difficult to understand or follow.

[{“id”: 1,“type”: “domainaddons”,“currency”: 1,“relid”: 0,“msetupfee”: “0.00”,“qsetupfee”: “0.00”,“ssetupfee”: “2.50”,“asetupfee”: “0.00”,“bsetupfee”: “0.00”,“tsetupfee”: “0.00”,“monthly”: “0.00”,“quarterly”: “0.00”,“semiannually”: “0.00”,“annually”: “0.00”,“biennially”: “0.00”,“triennially”: “0.00”},
{“id”: 2,“type”: “domainregister”,“currency”: 1,“relid”: 1,“msetupfee”: “9.95”,“qsetupfee”: “19.95”,“ssetupfee”: “32.95”,“asetupfee”: “45.95”,“bsetupfee”: “59.95”,“tsetupfee”: “0.00”,“monthly”: “69.95”,“quarterly”: “79.95”,“semiannually”: “89.95”,“annually”: “99.95”,“biennially”: “-1.00”,“triennially”: “0.00”},
{“id”: 3,“type”: “domaintransfer”,“currency”: 1,“relid”: 1,“msetupfee”: “9.95”,“qsetupfee”: “-1.00”,“ssetupfee”: “-1.00”,“asetupfee”: “-1.00”,“bsetupfee”: “-1.00”,“tsetupfee”: “0.00”,“monthly”: “-1.00”,“quarterly”: “-1.00”,“semiannually”: “-1.00”,“annually”: “-1.00”,“biennially”: “-1.00”,“triennially”: “0.00”},
{“id”: 4,“type”: “domainrenew”,“currency”: 1,“relid”: 1,“msetupfee”: “9.95”,“qsetupfee”: “19.95”,“ssetupfee”: “32.95”,“asetupfee”: “45.95”,“bsetupfee”: “59.95”,“tsetupfee”: “0.00”,“monthly”: “69.95”,“quarterly”: “79.95”,“semiannually”: “89.95”,“annually”: “99.95”,“biennially”: “-1.00”,“triennially”: “0.00”},
{“id”: 5,“type”: “domainregister”,“currency”: 1,“relid”: 2,“msetupfee”: “12.95”,“qsetupfee”: “24.95”,“ssetupfee”: “34.95”,“asetupfee”: “49.95”,“bsetupfee”: “64.95”,“tsetupfee”: “0.00”,“monthly”: “-1.00”,“quarterly”: “-1.00”,“semiannually”: “-1.00”,“annually”: “-1.00”,“biennially”: “-1.00”,“triennially”: “0.00”},
{“id”: 6,“type”: “domaintransfer”,“currency”: 1,“relid”: 2,“msetupfee”: “12.95”,“qsetupfee”: “-1.00”,“ssetupfee”: “-1.00”,“asetupfee”: “-1.00”,“bsetupfee”: “-1.00”,“tsetupfee”: “0.00”,“monthly”: “-1.00”,“quarterly”: “-1.00”,“semiannually”: “-1.00”,“annually”: “-1.00”,“biennially”: “-1.00”,“triennially”: “0.00”}]

@Haaser Can you give me an idea of your desired output (in HTML), please?

Well I need to pull data from a few different json files but I assume that should not be difficult once I get one figured out. We use a business system called WHMCS, and when prices/information changes in the database I will need to export the json file to update the website. So I am not sure if I will have to use hugo to rebuild the site every time or if it can load the information direct from the json file.

Basically my html output is just a table 4 columns with information from server specs, price, location, etc. The best example I can give you is a direct link to the website. as you will see it loads slow which is why I am switching to this but i need to be able to pull information from the json file to populate the site with the correct information.

You would either have to build it every time it changes or load the JSON client side (Javascript, which is a question outside of Hugo).

If you want to load JSON in a content file, I would create a shortcode for it. There isn’t very powerful ways of doing queries in JSON, so I would suggest you do the partitioning of the data when you export it from the database, so you can address the entities you want directly in the object graph, aka. would list the server options in Denver.

1 Like

I have never coded shortcode before so I am not sure what I will have to do to the JSON. Each line has a ID field which represents the dedicated server. Is there any documentation on shortcode or how do I go about starting to learn / code this?

Content on the site changes but not that often and I can just rebuild it and upload when it does. I am going for a very fast website so I assume that using javascript to load the json would slow it down?


Yes been there lots and it may be friendly to experienced users but for beginners it does not help. I assume this would of helped me more but it does not.

I wrote the shortcode documentation, so if that doesn’t work, I’m not in a position to make it more clear.

I think my problem is that I understand what a shortcode can do but I am not sure how to code the shortcode. Is it written in php,java,html or what language? The document tells you how to use shortcodes but does not tell you how to write them. I am just not sure where to begin to code my own shortcode. Also are we sure I should be using shortcodes and not data driven content?

I think you were pointed to the introduction for good reason here.

I would recommend starting with the overview under templates:

The only thing that Hugo concerns itself with is HTML, which is handled via HTML itself, Golang templates, and your markdown files (which are technically handled by BlackFriday, a markdown renderer written in Golang). If you learn the templating, you’ve learned how to write shortcodes, but asking about Java and PHP indicates to me that you should first RTD.


So I have been plugging along and learning as I go but I have ran into a problem and I can not figure out what to do to resolve this issue. I am using phpmyadmin to extract our products from mysql to json which it does well but the problem I am having is when hugo builds the site it is changing the < p > html tag from json to ascii code. & l t ; p & g t ; but without the spaces as I am not sure how to post it.


{“id”: 126,“name”: “Bargain Server 1”,“description”: “

Dual Core ATOM ( 2 x 1.6Ghz )
2GB RAM, 250GB HDD 10Mbps, 100Mbps, 1Gbps


See the safeHTML template function.

1 Like

Thank you that worked!