*

BabyDunk

  • ****
  • 161 posts
[Suggestion] Share button's for users store/profile
« on: August 04, 2016, 12:29:12 AM »
Share buttons for the users profile/store . if user has a lot of listings. why not give them the option to share their store with others .  below is how. although i would like it if when shared, that the users logo/profile picture would be grab instead of a random picture/preselected picture. still need to figure that bit out :D

here we go.

find this inside user-public-profile.php
Code: [Select]
      <!-- SELLER INFORMATION -->
      <div id="description">
        <?php if(function_exists('profile_picture_show')) { profile_picture_show(200); } ?>

replace with this
Code: [Select]
      <!-- SELLER INFORMATION -->
      <div id="description">
       <div id="profile-share">           
            <h1><?php _e('Share our store''patricia'); ?></h1>
            <a class="single single-viber" href="viber://forward?text=Why not have a  look at  <?php echo osc_user_name (); ?>'s online store.  <?php echo osc_user_public_profile_url(); ?>"><i class="fa fa-phone-square"></i></a>
            <a class="single single-whatsapp" href="whatsapp://send?text=Why not have a  look at  <?php echo osc_user_name (); ?>'s online store.  <?php echo osc_user_public_profile_url(); ?>" data-action="share/whatsapp/share"><i class="fa fa-whatsapp"></i></a>
            <a class="single single-facebook" title="<?php echo osc_esc_html(__('Share on Facebook''patricia')); ?>" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=<?php echo osc_user_public_profile_url(); ?>"><i class="fa fa-facebook-square"></i></a>
            <a class="single single-google-plus" title="<?php echo osc_esc_html(__('Share on Google Plus''patricia')); ?>" target="_blank" href="https://plus.google.com/share?url=<?php echo osc_user_public_profile_url(); ?>"><i class="fa fa-google-plus-square"></i></a>
            <a class="single single-twitter" title="<?php echo osc_esc_html(__('Share on Twitter''patricia')); ?>" target="_blank" href="https://twitter.com/home?status=<?php echo osc_user_public_profile_url(); ?>%20-%20<?php _e('Why not have a  look at''patricia'); ?>%20<?php echo osc_user_name(); ?><?php _e('\'s''patricia'); ?>%20<?php _e('online''patricia'); ?>%20<?php _e('store.''patricia'); ?>"><i class="fa fa-twitter-square"></i></a>
            <a class="single single-pinterest" title="<?php echo osc_esc_html(__('Share on Pinterest''patricia')); ?>" target="_blank" href="https://pinterest.com/pin/create/button/?url=<?php echo osc_user_public_profile_url(); ?>&media=<?php echo osc_base_url(); ?>/oc-content/themes/patricia/images/logo.jpg&description=Why not have a  look at <?php echo osc_user_name (); ?>'s online store."><i class="fa fa-pinterest-square"></i></a>
      </div>
      <?php if(function_exists('profile_picture_show')) { profile_picture_show(200); } ?>

if you prefer to display username rather than real name you can change the osc_user_name() to osc_user_username()

also for pinterest. if your logo isn't large enough you may have to create an image specifically for pinterest. if we could get the profile picture grabbed instead would be excellent.
i think the minimum limit for pinterest is 100px x 200px .


add this to style.css
Code: [Select]
/* PROFILE SOCIAL SHARE BUTTONS */
#profile-share {float: left;width: 100%;text-align: center;margin: -10px 0 5px -7px;position:relative;}
#profile-share h1 {margin:0 0 0;}
#profile-share .single {margin:0 3px;background:#f2f2f2;display: inline-block;}
#profile-share .single .fa {font-size:45px;float:left;cursor:pointer;opacity:0.8;width:42px;}
#profile-share .single:hover .fa {opacity:1;}
#profile-share .single-twitter .fa {color:#00ACB3;}
#profile-share .single-viber .fa {color:#8156a3;}
#profile-share .single-whatsapp .fa {color:#43d854;}
#profile-share .single-facebook .fa {color:#0067CB;}
#profile-share .single-google-plus .fa {color:#E23C00;}
#profile-share .single-pinterest .fa {color:#B60000;}


also add this to responsive.css
Code: [Select]
/* Profile Whatsapp and Viber Share Button */
@media screen and (min-width:690px){
    #profile-share .single-whatsapp .fa {display:none;}
    #profile-share .single-viber .fa {display:none;}
}

hope this helps someone :D
Chris
I Am A Noob But I Am Here To Learn.
Please be patient ;) ;D

*

MB Themes

Re: [Suggestion] Share button's for users store/profile
« Reply #1 on: August 04, 2016, 08:55:38 AM »
@BabyDunk
Nice tip. For image correction you need to use facebook meta:
Code: [Select]
<meta property="og:image" content="http://zara.mb-themes.com/oc-content/uploads/3/644.jpg" />
  To get fast support, we need following details: Detail description, URL to reproduce problem, Screenshots

*

BabyDunk

  • ****
  • 161 posts
Re: [Suggestion] Share button's for users store/profile
« Reply #2 on: August 04, 2016, 11:28:23 AM »
@Frosticek
Thank you :D

can you drop that right in the middle of the share button like you can with the pinterest &media= tag ?

i suspect that it has to go in the head only and i have open-graph plugin for that.


Many Thanks
Chris

I Am A Noob But I Am Here To Learn.
Please be patient ;) ;D

*

MB Themes

Re: [Suggestion] Share button's for users store/profile
« Reply #3 on: August 04, 2016, 12:05:02 PM »
@BabyDunk
It must be in head.
  To get fast support, we need following details: Detail description, URL to reproduce problem, Screenshots