Hi
I am formatting sharePoint List with JSON . I want Add to links to the footer . I am new to JSON. so i am able to add One link with JSON like below code. How can i add another link to the form footer
Below is the code :
{
"$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
}
I want to show two links in footer .
Thank you
Narender G
Solved! Go to Solution.
Hi @ursNani ,
I looked at https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json
and the HTML-tags you can use are:
"enum": [ "div", "button", "span", "a", "img", "svg", "path"
so something like <nav>, which would be perfect, cannot be used...
However, I came up with this:
{
"elmType": "div",
"style": {
"width": "100%",
"text-align": "left",
"overflow": "hidden",
"border-top-width": "1px"
},
"children": [
{
"elmType": "div",
"style": {
"height": "15px",
"width": "15%",
"color": "#fff",
"font-size": "13px",
"border-top": "5px solid #eee",
"background-color": "orange",
"padding": "10px"
},
"children": [
{
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
}
]
},
{
"elmType": "div",
"style": {
"height": "15px",
"width": "15%",
"color": "#fff",
"font-size": "13px",
"border-top": "5px solid #eee",
"background-color": "orange",
"padding": "10px"
},
"children": [
{
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
}
]
}
]
}
You can change the two div's that have a width of 15% to the percentage that fits you.
This is the best I can do 🙂
If it's what you looked for: accept as solution to close this topic 😉
Hi @ursNani ,
I'm not really familiar with JSON formatting but using
How to Use JSON to Customize a SharePoint List Form (mrsharepoint.guru)
I came up with:
{
"elmType": "div",
"style": {
"width": "100%",
"text-align": "left",
"overflow": "hidden",
"border-top-width": "1px"
},
"children": [
{
"elmType": "div",
"style": {
"height": "15px",
"width": "100%",
"color": "#fff",
"font-size": "13px",
"border-top": "5px solid #eee",
"background-color": "orange",
"padding": "10px"
},
"children": [
{
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
},
{
"elmType": "a",
"txtContent": "DuckDuckGo",
"attributes": {
"target": "_blank",
"href": "https://www.duckduckgo.com/"
}
}
]
}
]
}
As I say: no expert here. Formatting the links so they don't stick together is something I haven't mastered yet 🙂
Marc
@Waegemma
Thanks for the help . Its work perfectly . but i want to space them between. Can we do that
Thank you
@Waegemma
Thanks for the help . Its work perfectly . but i want to space them between. Can we do that
Thank you
Hi @ursNani ,
I looked at https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json
and the HTML-tags you can use are:
"enum": [ "div", "button", "span", "a", "img", "svg", "path"
so something like <nav>, which would be perfect, cannot be used...
However, I came up with this:
{
"elmType": "div",
"style": {
"width": "100%",
"text-align": "left",
"overflow": "hidden",
"border-top-width": "1px"
},
"children": [
{
"elmType": "div",
"style": {
"height": "15px",
"width": "15%",
"color": "#fff",
"font-size": "13px",
"border-top": "5px solid #eee",
"background-color": "orange",
"padding": "10px"
},
"children": [
{
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
}
]
},
{
"elmType": "div",
"style": {
"height": "15px",
"width": "15%",
"color": "#fff",
"font-size": "13px",
"border-top": "5px solid #eee",
"background-color": "orange",
"padding": "10px"
},
"children": [
{
"elmType": "a",
"txtContent": "Google",
"attributes": {
"target": "_blank",
"href": "https://www.google.com/"
}
}
]
}
]
}
You can change the two div's that have a width of 15% to the percentage that fits you.
This is the best I can do 🙂
If it's what you looked for: accept as solution to close this topic 😉
User | Count |
---|---|
156 | |
91 | |
67 | |
63 | |
62 |
User | Count |
---|---|
211 | |
157 | |
96 | |
86 | |
76 |