2

I am trying to get the website link, and put it in an image source adding image path, Example: suppose that I'm inside a website, I want to get the link of it and add my image path to it and inject it in source image in the source code of the same page.

Note : that I am using SharePoint site , can we do it with HTML or JavaScript ?

Yogesh
  • 1,565
  • 1
  • 19
  • 46
ysfibm
  • 436
  • 2
  • 14
  • 30

3 Answers3

1

You can get the website address from javascript. Use below code.

window.location.href  : Complete link 
window.location.host : you'll get sub.domain.com:8080 or sub.domain.com:80.
window.location.hostname : you'll get sub.domain.com.
window.location.protocol : you'll get http:
window.location.port : you'll get 8080 or 80.

There are other properties exposed for window.location object.

Venkata Dorisala
  • 4,783
  • 7
  • 49
  • 90
  • so how can i get a part of my link example: https://mydomaine.sharepoint.com/sites/sitecollection/site1/acceuil.aspx i wanna only get : https://mydomaine.sharepoint.com/sites/sitecollection/site1 and add to it img/banner.png and inhect it in html img src – ysfibm Jun 28 '16 at 09:34
  • Once you get the whole url using `location.href` you can apply some logic like finding last index of `/` and stripping it and then appending `img/banner.png` – Venkata Dorisala Jun 28 '16 at 11:47
  • http://stackoverflow.com/questions/3213083/how-do-i-trim-strip-the-url-down-to-the-page-name – Venkata Dorisala Jun 28 '16 at 11:48
1

There is a global javascript variable _spPageContextInfo available on all SharePoint pages. It contains essential information about the current context.

Depending on whether your image is stored on web or site collection level, you should use one of those:

_spPageContextInfo.webAbsoluteUrl
_spPageContextInfo.siteAbsoluteUrl
dstarkowski
  • 337
  • 3
  • 14
0

to get the location of the website, you write the following in js

window.location.href //gives complete href path

to add it to an image, you can append an image to the html by writing:

var elem = document.createElement("img");
elem.src = window.location.href+"/my-image.png";
elem.setAttribute("height", "200");
elem.setAttribute("width", "200");
elem.setAttribute("alt", "my image");
document.querySelector("#image-container").appendChild(elem);

Updated answer no.2:

Since it is your base path that you want, you can hardcode it since its never changing.

Append an image to the html by writing:

var fullPath = window.location.href;
var baseDomain = fullPath.split('site1')[0];
var pngPath = '_catalogs/masterpage/images/banner1.png';
var elem = document.createElement("img");
elem.src = baseDomain + pngPath;
elem.setAttribute("height", "200");
elem.setAttribute("width", "200");
elem.setAttribute("alt", "Banner");
document.querySelector("#banner").appendChild(elem);
Bamieh
  • 10,358
  • 4
  • 31
  • 52
  • in my case this is my link : https://mydomaine.sharepoint.com/sites/sitecollection/site1/SitePages/Accueil.aspx i wanna get it and take only : https://mydomaine.sharepoint.com/sites/sitecollection/site1 and add to it : _catalogs/masterpage/images/banner1.png and inject it in my html code : – ysfibm Jun 28 '16 at 09:29
  • read the updated answer, also replace your html code with (just remove the img tag inside.) – Bamieh Jun 28 '16 at 09:42
  • its note my base path it can change i've just give you an example , first i should get the link : mydomaine.sharepoint.com/sites/sitecollection/site1/accueil.aspx, remove every thing after /site1 and add :_catalogs/masterpage/images/banner1.png and inject it – ysfibm Jun 28 '16 at 09:56
  • i used split, it will split a string into an array grouped from what is before site1 and what is after, taking [0] will give everything before site1. – Bamieh Jun 28 '16 at 10:19
  • http://stackoverflow.com/questions/3213083/how-do-i-trim-strip-the-url-down-to-the-page-name – Venkata Dorisala Jun 28 '16 at 11:50