{"id":3547,"date":"2019-09-03T15:39:38","date_gmt":"2019-09-03T15:39:38","guid":{"rendered":"https:\/\/wptest.sdelling.w3.uvm.edu\/?page_id=3547"},"modified":"2020-09-18T12:26:00","modified_gmt":"2020-09-18T16:26:00","slug":"social-sharing","status":"publish","type":"page","link":"https:\/\/blog.uvm.edu\/manual\/social-sharing\/","title":{"rendered":"Social Connect Icons"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Social Sharing and Social Connect<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p>If you want to send site visitors to <strong>your social media accounts<\/strong>, we have provided a list with various social icons. The URLs for each default to UVM&#8217;s social property. You can edit these manually by editing the HTML and replacing UVMs social account URL with your own. Sadly, there isn&#8217;t a YouTube icon at present. It&#8217;s on the &#8220;To Do&#8221; list to switch these over to SVG icons and provide some more options.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\"><\/div>\n<\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"170\" height=\"170\" src=\"http:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Link_toYour_Properties_150x150.jpg\" alt=\"\" class=\"wp-image-4195\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Link_toYour_Properties_150x150.jpg 170w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Link_toYour_Properties_150x150-150x150.jpg 150w\" sizes=\"auto, (max-width: 170px) 100vw, 170px\" \/><\/figure>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-atomic-blocks-ab-sharing ab-block-sharing ab-share-icon-only ab-share-shape-circular ab-share-size-medium ab-share-color-standard \">\n<ul class=\"ab-share-list\"><li>\n\t\t\t<a href=\"http:\/\/twitter.com\/uvmvermont\" class=\"ab-share-twitter\" title=\"Connect on Twitter\">\n\t\t\t\t<i class=\"fab fa-twitter\"><\/i> <span class=\"ab-social-text\">Share on Twitter<\/span>\n\t\t\t<\/a>\n\t\t<\/li><li>\n\t\t\t\t<a href=\"http:\/\/www.facebook.com\/UniversityofVermont\" class=\"ab-share-facebook\" title=\"Connect on Facebook\">\n\t\t\t\t\t<i class=\"fab fa-facebook-f\"><\/i> <span class=\"ab-social-text\">Share on Facebook<\/span>\n\t\t\t\t<\/a>\n\t\t\t<\/li><li>\n\t\t\t\t<a href=\"http:\/\/www.linkedin.com\/edu\/school?id=19631\" class=\"ab-share-linkedin\" title=\"Connect on LinkedIn\">\n\t\t\t\t\t<i class=\"fab fa-linkedin-in\"><\/i> <span class=\"ab-social-text\">Connect on LinkedIn<\/span>\n\t\t\t\t<\/a>\n\t\t\t<\/li><li>\n\t\t\t\t\t<a href=\"mailto:name@mydomain.com\" class=\"ab-share-email\" title=\"Share via Email\">\n\t\t\t\t\t\t<i class=\"fas fa-envelope\"><\/i> <span class=\"ab-social-text\">Share via Email<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/li><\/ul>\n<\/div>\n<p><em>Opens in new browser window<\/em><\/p>\n\n\n\n<div style=\"height:48px\" aria-hidden=\"true\" role=\"presentation\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">To edit the links for the icons<\/h2>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>First, you will need to convert the icon block to a regular block.<\/p>\n\n\n\n<div style=\"height:20px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"641\" height=\"433\" src=\"http:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.42-PM.png\" alt=\"\" class=\"wp-image-4191\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.42-PM.png 641w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.42-PM-300x203.png 300w\" sizes=\"auto, (max-width: 641px) 100vw, 641px\" \/><\/figure>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p>Then you will see the HTML version. You&#8217;ll need to know a little bit about HTML to edit this. Take a look at the highlighted text in this paragraph. Basically, find the &lt;a href=&quot;.. and replace the url with your designated social media account. It&#039;s OK if you leave it to default.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\"><\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"305\" src=\"http:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.57-PM-1024x305.png\" alt=\"\" class=\"wp-image-4188\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.57-PM-1024x305.png 1024w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.57-PM-300x89.png 300w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.57-PM-768x229.png 768w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Screen-Shot-2019-09-20-at-4.48.57-PM.png 1248w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div style=\"height:120px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Sharing Your Content on Social<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<p>If you want to send site visitors to <strong>your social media accounts<\/strong>, we have provided a list with various social icons. The URLs for each default to UVM&#8217;s social property. You can edit these manually by editing the HTML and replacing UVMs social account URL with your own. Sadly, there isn&#8217;t a YouTube icon at present. It&#8217;s on the &#8220;To Do&#8221; list to switch these over to SVG icons and provide some more options.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\"><\/div>\n<\/div>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"170\" height=\"170\" src=\"http:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Share_content_150x150.jpg\" alt=\"\" class=\"wp-image-4194\" srcset=\"https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Share_content_150x150.jpg 170w, https:\/\/blog.uvm.edu\/manual\/files\/2019\/09\/Social_Icons_Share_content_150x150-150x150.jpg 150w\" sizes=\"auto, (max-width: 170px) 100vw, 170px\" \/><\/figure>\n\n\n<div class=\"wp-block-atomic-blocks-ab-sharing ab-block-sharing ab-share-icon-only ab-share-shape-circular ab-share-size-medium ab-share-color-standard \">\n\t\t\t<ul class=\"ab-share-list\"><li>\n\t\t\t<a\n\t\t\t\thref=\"javascript:void(0)\" onClick=\"javascript:atomicBlocksShare('http:\/\/twitter.com\/share?text=Social%20Connect%20Icons&#038;url=https:\/\/blog.uvm.edu\/manual\/social-sharing\/', 'Share on Twitter', '600', '600')\"\n\t\t\t\tclass=\"ab-share-twitter\"\n\t\t\t\ttitle=\"Share on Twitter\">\n\t\t\t\t<i class=\"fab fa-twitter\"><\/i> <span class=\"ab-social-text\">Share on Twitter<\/span>\n\t\t\t<\/a>\n\t\t<\/li><li>\n\t\t\t\t<a\n\t\t\t\t\thref=\"javascript:void(0)\" onClick=\"javascript:atomicBlocksShare('https:\/\/www.facebook.com\/sharer\/sharer.php?u=https:\/\/blog.uvm.edu\/manual\/social-sharing\/&#038;title=Social%20Connect%20Icons', 'Share on Facebook', '600', '600')\"\n\t\t\t\t\tclass=\"ab-share-facebook\"\n\t\t\t\t\ttitle=\"Share on Facebook\">\n\t\t\t\t\t<i class=\"fab fa-facebook-f\"><\/i> <span class=\"ab-social-text\">Share on Facebook<\/span>\n\t\t\t\t<\/a>\n\t\t\t<\/li><li>\n\t\t\t\t<a\n\t\t\t\t\thref=\"javascript:void(0)\" onClick=\"javascript:atomicBlocksShare('https:\/\/www.linkedin.com\/shareArticle?mini=true&#038;url=https:\/\/blog.uvm.edu\/manual\/social-sharing\/&#038;title=Social%20Connect%20Icons', 'Share on LinkedIn', '600', '600')\"\n\t\t\t\t\tclass=\"ab-share-linkedin\"\n\t\t\t\t\ttitle=\"Share on LinkedIn\">\n\t\t\t\t\t<i class=\"fab fa-linkedin-in\"><\/i> <span class=\"ab-social-text\">Share on LinkedIn<\/span>\n\t\t\t\t<\/a>\n\t\t\t<\/li><li>\n\t\t\t\t\t<a\n\t\t\t\t\t\thref=\"mailto:?subject=Social%20Connect%20Icons&#038;body=Social%20Connect%20Icons&mdash;https:\/\/blog.uvm.edu\/manual\/social-sharing\/\"\n\t\t\t\t\t\tclass=\"ab-share-email\"\n\t\t\t\t\t\ttitle=\"Share via Email\">\n\t\t\t\t\t\t<i class=\"fas fa-envelope\"><\/i> <span class=\"ab-social-text\">Share via Email<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/li><\/ul>\n\t\t<\/div>\n\n\n<p><em>Opens in new browser window<\/em><\/p>\n\n\n\n<div style=\"height:120px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div style=\"height:24px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><\/h2>\n","protected":false},"excerpt":{"rendered":"<p>Social Sharing and Social Connect If you want to send site visitors to your social media accounts, we have provided a list with various social icons. The URLs for each default to UVM&#8217;s social property. You can edit these manually by editing the HTML and replacing UVMs social account URL with your own. Sadly, there &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/blog.uvm.edu\/manual\/social-sharing\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Social Connect Icons&#8221;<\/span><\/a><\/p>\n","protected":false},"author":5625,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3547","page","type-page","status-publish","hentry","entry"],"featured_image_src":null,"featured_image_src_square":null,"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"smasonla","author_link":"https:\/\/blog.uvm.edu\/manual\/author\/smasonla\/"},"rttpg_comment":0,"rttpg_category":null,"rttpg_excerpt":"Social Sharing and Social Connect If you want to send site visitors to your social media accounts, we have provided a list with various social icons. The URLs for each default to UVM&#8217;s social property. You can edit these manually by editing the HTML and replacing UVMs social account URL with your own. Sadly, there&hellip;","_links":{"self":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/3547","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/users\/5625"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/comments?post=3547"}],"version-history":[{"count":5,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/3547\/revisions"}],"predecessor-version":[{"id":5326,"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/pages\/3547\/revisions\/5326"}],"wp:attachment":[{"href":"https:\/\/blog.uvm.edu\/manual\/wp-json\/wp\/v2\/media?parent=3547"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}