| Author |
 Topic  |
|
|
deskline
Starting Member
Australia
19 Posts |
 Posted - July 30 2015 : 00:34:14
|
| We trying to set up Social Media links at the bottom of our Version 8 website. This is done thru the Footer Left Container Text Box, and just needs editing of the entry that is already there. We can edit Facebook etc, but having trouble finding the icon for Google +. Facebook is "icon-social facebook ir", youtube is "icon-social youtube ir", although Instagram is "icon-social instragram ir". Have tried all sorts of variations for the google icon but whatever we change it to keeps coming back to the Twitter icon. Has anyone else successfully edited a Google + link ? |
|
|
AleChe91
VP-CART New User
Italy
128 Posts |
Posted - July 31 2015 : 02:53:01
|
there is no google + icon.. i''ve asked some weeks ago the same question :D
try to use the tool of addthis.com, it''s free
Alessandro
Stock Elettrico S.r.l. |
Edited by - AleChe91 on July 31 2015 02:53:52 |
 |
|
|
ryo_best
VP-CART New User
90 Posts |
Posted - September 26 2015 : 00:51:54
|
| is it because google+ not supported by VPASP version 8 ? |
Edited by - ryo_best on September 26 2015 00:52:21 |
|
|
|
jack208
VP-CART New User
Malaysia
116 Posts |
Posted - November 28 2015 : 06:10:07
|
| Is there any documentation that provides a list of the social media icons available? |
|
|
|
ryo_best
VP-CART New User
90 Posts |
Posted - December 04 2015 : 20:02:09
|
Hi jack, i''ve read the manual, and found the default social media icons available supported by v8,
It''s in chapter 4.20.6.2.1.1 Footer Free Text Container, and no google+ icon right now, maybe they will support this in future release. |
|
|
|
squirrel
VP-CART New User
USA
73 Posts |
Posted - December 07 2015 : 03:42:55
|
Yup, Google+ is not available in my cart too...  |
|
|
|
serjtankian
VP-CART Super User
Armenia
378 Posts |
Posted - December 07 2015 : 13:45:32
|
i think it''s a glitch, maybe developer forgot to put google+ icon
*serj* |
|
|
|
ils5gvl
Starting Member
USA
15 Posts |
Posted - December 09 2015 : 10:17:07
|
I''m trying to get the Google+ link also. Using the Footer Left Container editor from Layout Manager, I duplicated and then modified the Twitter instance and used the following configuration:
<li><a class="icon-social google ir" title="RainHarvest Systems on Google+" href="https://www.google.com/+Rainharvest">Google+</a></li>
But the icon remains a Twitter icon and the URL, not too surprisingly, drops the ''+'' from the URL which sends the visitor to a Google 404 page.
I wasn''t able to figure out where to put icons or configure the class. Does anyone know how to do this? |
|
|
|
squirrel
VP-CART New User
USA
73 Posts |
Posted - December 09 2015 : 21:42:33
|
Hi guys  ,
Finally...I manage to add the Google+ icon to my site''s footer and I am sharing my methods with you guys.
a. Go to \templates\default\css\ and open the main-responsive.css file on your notepad or Notepad++. I personally prefer Notepad++.
b. Go to line 247 and enter the following lines below it (in line 248):
.icon-social.google {
background-position: -400px 0;
}
c. Save it and now go and edit the Footer Left Container from Layout Manager by inserting the following line:
<a class="icon-social google ir" title="My Domain on Google" href="http://www.google.com/">GooglePlus</a></li>
This works for me  ...Let me know if you guys are still having trouble...
Regards |
|
|
|
danielrichardson
VP-CART Super User
Australia
276 Posts |
Posted - December 10 2015 : 07:36:33
|
| This one need to bookmark to our browser. THanks for added google+ code squirrel. |
|
|
|
ils5gvl
Starting Member
USA
15 Posts |
Posted - December 13 2015 : 04:40:00
|
Hi Squirrel,
Thank you for your post.
I tried your procedure but I''m getting different results. The Twitter icon that used to be there has changed to a Vimeo icon and I wasn''t able to get our Google+ account page to open when clicking the icon. The URL you provided, if entered verbatim, goes to a Google error page. I attempted several modifications of the URL and I can make it almost work but I still get the Google 404 page. Our Google+ Custom URL is https://www.google.com/+Rainharvest and the "+" is being removed. Any ideas on why I''ve got a Vimeo icon and how to preserve the special character in the URL? |
|
|
|
squirrel
VP-CART New User
USA
73 Posts |
Posted - December 13 2015 : 07:31:14
|
@ils5gvl
Hi there ,
What version of the software are you using? I think I am on the latest version as I am on the business ready plan... Well, this is how my main-responsive.css file looks like (for social icons/footer):
/* NEW FOOTER */
.footer { padding-top: 10px; padding-bottom: 10px;}
.unstyled { list-style: none; padding-left: 0px;}
.icon-social {
background: url("../../../images/social-icons.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
height: 32px;
opacity: 0.3;
text-indent: -9999px;
width: 32px;
transition: opacity 2s;
}
.icon-social {
margin-bottom: 5px;
margin-right: 5px;
}
.icon-social {
display: inline-block;
width: 32px;
height: 32px;
}
.icon-social.facebook {
background-position: -50px 0;
}
.icon-social.youtube {
background-position: -100px 0;
}
.icon-social.rss {
background-position: -150px 0;
}
.icon-social.pinterest {
background-position: -250px 0;
}
.icon-social.instragram {
background-position: -200px 0;
}
.icon-social.google {
background-position: -400px 0;
}
By the way, how many icons do you have in your image\social-icons.png? Do you see Google icon over there?
Let me know.
Thanks,
Daniel |
|
|
|
ils5gvl
Starting Member
USA
15 Posts |
Posted - December 14 2015 : 10:07:06
|
Hi Daniel. Thank you. I''ve finally got the Google+ icon displaying. I originally set the background-position for the next logical sequence of -300px instead of -400. Setting it at -400 fixed that and I''ve learned something about that css property in the process.
I fixed the link to Google+ working by using our generic/numeric Google+ URL instead of our custom URL. The custom URL contains a "+" symbol which doesn''t get passed through. To find your non-custom Google+ URL, just go to your personal Google+ page and hover over the icon for the company in the "In your circles" area and see the numberic URL in the browser. Right-click on the image and "Copy link address" and use that URL for the Google+ URL in the Footer Left Container".
I''m running VP-ASP Deluxe 8.00.10.2. My main.responsive.css for social media icons looks like yours, above.
Here''s how my Footer Left Container looks now
<ul class="unstyled">
<li><a class="icon-social twitter ir" title="RainHarvest Systems on Twitter" href="https://twitter.com/RainHarvestSys">Twitter</a></li>
<li><a class="icon-social facebook ir" title="RainHarvest Systems on Facebook"
href="https://www.facebook.com/RainHarvestSys">Facebook</a></li>
<li><a class="icon-social youtube ir" title="RainHarvest Systems on YouTube"
href="https://www.youtube.com/user/RainHarvest">YouTube</a></li>
<li><a class="icon-social pinterest ir" title="RainHarvest Systems on Pinterest" href="http://www.pinterest.com/RainHarvestSys/">Pinterest</a></li>
<a class="icon-social google ir" title="RainHarvest Systems on Google" href="https://plus.google.com/u/1/106642963077247136155">GooglePlus</a></li>
</ul>
Thanks very much for the help.
Randy
|
|
|
|
squirrel
VP-CART New User
USA
73 Posts |
Posted - December 17 2015 : 20:25:02
|
Hi Randy,
Glad to know that I could be of help.
Thanks,
Daniel |
|
|
| |
Topic |
|
All Forums
Social Media Links
New Topic
Printer Friendly
TrustGuard - PCI Security Scanner
