کد گوگل پلاس (1+) با طراحی زیبا و فلت دیزاین

در این پست از وب سایت اسکریپت دات کام , کد گوگل پلاس (1+) با طراحی زیبا و فلت دیزاین را برای شما آماده ساخته ام که امیدوارم از آن استفاده کرده و راضی کننده باشد .

با قرار دادن چند خط کد که در ادامه توضیح خواهم داد , شما به راحتی میتوانید صفحات خود را توسط کاربران , در گوگل پلاسشان Share نمایید و با این کار هم به رتبه ی خود در سئو کمک کنید و هم بازدید وب سایت خود را ارتقا بخشید .

و اما آموزش :

در ابتدا کد های زیر را به css خود اضافه نمایید :

 .google-plus-vms{
    background:url(http://www.xn--mgbguh09aqiwi.com/wp-content/uploads/vms/google-plus.png) no-repeat 95% center;
    width:300px;
    height:40px;
    background-color:#e74c3c;
    border-radius:5px;
    border-bottom:3px solid #da2c1a;
    display:flex;
    align-items:center;
    justify-content: flex-end;
    flex-direction: row-reverse;
    position:fixed;
    left:5px;
    bottom:5px;
    z-index:1000;
    font-size: 12px;
    font-family:Tahoma;
    color:#fff;
    text-align: center;
}
 .goggle-plus-button{
    width: 33%;
    display:flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0 10px 0 0;
}

و سپس کد زیر را در قالب وب سایت خود قرار دهید . ( بهترین مکان قبل از بسته شدن تگ <body/> می باشد .

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<div class="google-plus-vms">
  <p>با یک کلیک از ما حمایت کنید</p>
  <div class="goggle-plus-button">
  <g:plusone size="large" href="http://www.xn--mgbguh09aqiwi.com"></g:plusone>
  </div>
</div>

نکته مهم : در کد بالا به جای http://www.xn--mgbguh09aqiwi.com باید نام وب سایت خود را بنویسید .

پخش اختصاصی

گرداوری و آموزش : وحید مجیدی