Social Sharing Alternative 2

For this example, we’ll use the “Herbert Hoover” skin, but any skin can be used for this if you add social icon elements to the skin. Before continuing, review the documentation’s Item Skin Editor section to familiarize yourself with this part of the plugin’s admin.

Select the icon with your mouse in the preview canvas:

Right-click the icon, and choose “Inspect Element” (for this tutorial, I’m using Firefox, but all the major browsers now include this option).

Copy the raw HTML highlighted in the browser’s console.

Next, visit this website: https://www.sharelinkgenerator.com/

Don’t worry about entering a link for now (we’ll add that soon!). For now, just click the “Create the Link” button for whatever social site you want. Then copy the “URL Only” part.

Next, inside the “Layer Settings” section, choose “Text/HTML” for the element’s “Source”:

Next, add the following HTML as shown in the following screenshot:

Next, paste the HTML you copied from the browser’s console inside the hyperlink:

Next, paste the url you copied from the “sharelinkgenerator” site into the “href” part of the hyperlink:

Finally, add %eg-url% at the end of the “href” part like this:

And then save the skin:

Next, add a new Custom Meta:

Enter “url” into the “Handle” part, and then the name can be anything.

Finally, visit one of the posts being pulled into the Grid. Assuming you want to share the post associated with the Grid Item, copy the post’s permalink as shown in the screenshot below. Otherwise you can write anything you want into the “My Social URL” field instead.

Next, scroll down the page, and enter the url into the “Essential Grid Settings -> Custom Meta -> My Social URL” part:

Finally, save the post, and view your Grid in the front-end of your site. Then click the icon you setup in for the post’s Grid Item to see it working. Then repeat the process for any other icons you want to setup.