Share button | Javascript

/* 
Social Share Links:
WhatsApp:
https://wa.me/?text=[post-title] [post-url]
Facebook:
https://www.facebook.com/sharer.php?u=[post-url]
Twitter:
https://twitter.com/share?url=[post-url]&text=[post-title]
Pinterest:
https://pinterest.com/pin/create/bookmarklet/?media=[post-img]&url=[post-url]&is_video=[is_video]&description=[post-title]
LinkedIn:
https://www.linkedin.com/shareArticle?url=[post-url]&title=[post-title]
*/

const facebookBtn = document.querySelector(".facebook-btn");
const twitterBtn = document.querySelector(".twitter-btn");
const pinterestBtn = document.querySelector(".pinterest-btn");
const linkedinBtn = document.querySelector(".linkedin-btn");
const whatsappBtn = document.querySelector(".whatsapp-btn");

function init() {
  const pinterestImg = document.querySelector(".pinterest-img");

  let postUrl = encodeURI(document.location.href);
  let postTitle = encodeURI("Hi everyone, please check this out: ");
//   let postImg = encodeURI(pinterestImg.src);

  facebookBtn.setAttribute(
    "href",
    `https://www.facebook.com/sharer.php?u=${postUrl}`
  );

  twitterBtn.setAttribute(
    "href",
    `https://twitter.com/share?url=${postUrl}&text=${postTitle}`
    
  );

  pinterestBtn.setAttribute(
    "href",
    `https://pinterest.com/pin/create/bookmarklet/?media=${postImg}&url=${postUrl}&description=${postTitle}`
  );

  linkedinBtn.setAttribute(
    "href",
    `https://www.linkedin.com/shareArticle?url=${postUrl}&title=${postTitle}`
  );

  whatsappBtn.setAttribute(
    "href",
    `https://wa.me/?text=${postTitle} ${postUrl}`
  );
}

init();

Comments

Post a Comment

Popular posts from this blog

edistrict

  id: 100894661 prevpass: Chandan@1234 pass: Chandan@123             17/aug/2021 linked with: Adhaar: 490556476387 phone number: 8285281356 email id:  imjunior471@gmail.com pass: Chandan@123, 1-aug-2023
Read more

richTextEditor

  import   React   from   'react' ; import  { Editor ,  EditorState , getDefaultKeyBinding ,  RichUtils }  from   'draft-js' ; import    '../assets/StyleTextEditor.css' ; import   '../../node_modules/draft-js/dist/Draft.css' ; class   RichTextEditor   extends   React . Component  {       constructor (props) {         super ( props );         this . state   =  {editorState:  EditorState . createEmpty ()};         this . focus   =  ()  =>   this . refs . editor . focus ();         this . onChange   =  (editorState)  =>   this . setState ({ editorState });         this . handleKeyCommand   =   this . _handleKeyCommand . bind ( this ); ...
Read more

CSS-position property

  position:static; Element cannot be move from their position, that is element get fixed   position:relative; It helps move an element with respect to its original position. position:fixed: It moves the element with respect to the browser windows. The position of the element remains fixed even if we scroll the web page. The next element present after the position element takes the place of the element leaving no gap. position:absolute; It moves the element with respect to the nearest positioned ancestor element. Next element will take the gap. z-index; It is used to position an element along the z axis. It works only positioned on elements.
Read more