اضافه کردن دکمه +1 گوگل پلاس گوشه سایت یا صفحه

در اين بخش مي‌توانيد در مباحث مربوط به برنامه نويسي تحت وب به بحث بپردازيد

مدیران انجمن: athlon64x2, abbas.m.k, شوراي نظارت

ارسال پست
Captain II
Captain II
نمایه کاربر
پست: 749
تاریخ عضویت: پنج شنبه 8 اسفند 1387, 1:21 am
سپاس‌های ارسالی: 4039 بار
سپاس‌های دریافتی: 2805 بار

اضافه کردن دکمه +1 گوگل پلاس گوشه سایت یا صفحه

پست توسط Erratic » شنبه 23 شهریور 1392, 12:27 pm

همونطور که میدونید یکی دیگر از سرویس های گوگل، دکمه +1 گوگل پلاس اون هستش که میتونه یکی از رکن های سایت شما در زمینه سئو باشه.
کاربران شما بدینوسیله به سایت یا صفحه شما امتیاز میدهند و این امر باعث میشه که شما در گوگل محبوب بشید.
برای قرار دادن این دکمه شیوه های متفاوتی وجود داره اما در اصل همه شون یکی هستن. قصد من اینه که به شما یکی از زیباترین این دکمه ها رو همراه با توضیحات برای تغییر دادنش به شما آموزش بدم پس همراه ما باشید.
روشی که قراره یاد بگیریم روش استایل داخلی این دکمه هست بنابراین:


ابتدا این کد رو:
Please Login or Register, to see this code
در تگ:

Please Login or Register, to see this code
و در پایانش قرار میدیم میتونید اون رو زیر این تگ هم قرار بدید که از نظر شخصی من اینکارو بکنید بهتره


بعد کد زیر رو:
Please Login or Register, to see this code

قبل از این تگ:
Please Login or Register, to see this code

در صفحه مون قرار میدیم


اگر از وردپرس استفاده میکنید میتونید تگ <head> رو در فایل header.php و تگ </body> رو در داخل فایل footer.php جستجو کنید.

این مثال قرار گرفتن این کد رو در یک صفحه معمولی html نشون میده:
Please Login or Register, to see this code
که به این صورت در میاد:
  تصویر 
 حالا چطور این کد رو شخصی سازی کنیم؟ 

  کدی که میان تگ </body> قرار گرفت، این کد: 
  Please Login or Register, to see this code 
  مکان قرار گیری این دکمه رو تغییر بده. top از بالا و پایین و right از چپ و راست؛ با تغییر دادن شماره ها میتونید به مکان دلخواهتون نزدیک بشید که برحسب درصد هم محسابه میشه همچنین اعداد اعشار رو هم میپذیره. 
این کد:
Please Login or Register, to see this code
برای دور خط دار کردن این دکمه به کار میره میتونید با بالابردن این عدد دور خط اون رو زخیم تر کنید

این کد:
Please Login or Register, to see this code
میتونه رنگ دور خط تون رو تغییر بده, با عوض کردن اعداد

این کد:
Please Login or Register, to see this code
رنگ پس زمینه این کد رو تغییر میده با عوض کردن e8e8e8 .

تعدادی از رنگ ها
000000 مشکی
ff0000 قرمز
00ff00 لیمویی
0000ff آبی
ffff00 زرد
00ffff آبی کمرنگ
ff00ff بنفش
ffffff سفید
________
با این شیوه هم میتونید روشنایی رنگ هارو تنظیم کنید به عنوان مثال سیاه رو مثال میزنیم
000000 مشکی
404040 مشکی کمرنگ تر
808080 مشکی کمرنگ تر
c0c0c0 طوسی
e8e8e8 طوسی کمرنگ تر
ffffff سفید

این کد:
Please Login or Register, to see this code
اندازه پس زمینه و کلا همون دکمه رو افزایش یا کاهش میده, با تغییر عدد

این کد:
Please Login or Register, to see this code
گردی دور خط دکمه رو تغییر میده با تغییر عدد 10

این کد:
Please Login or Register, to see this code
فونت نوشته "امتیاز دهید" رو تغییر میده

این کد:
Please Login or Register, to see this code
اندازه نوشته مون رو تغییر میده

در اینجا میتونید با تغییر نوشته امتیاز دهید نوشته خودتون رو قرار بدید که البته هر چی نوشته تون طولانی تر باشه به نسب باید روی اندازه ش هم کار کنید
Please Login or Register, to see this code

همچنین برای تغییر خود دکمه +1 داخل کادر میتونید به جای این کد:
Please Login or Register, to see this code
از کدهای زیر هم استفاده کنید در واقع باید جایگزینش کنید

Please Login or Register, to see this code
یا
Please Login or Register, to see this code
یا
Please Login or Register, to see this code
کدهای فوق انواع اندازه های متفاوت از دکمه های +1 هستن که به سلیقه خودتون میتونید ازشون استفاده کنید.

دموی این اسکریپت رو از [لینک خارجی برای کاربران مهمان مخفی است، لطفا برای مشاهده لینک ثبت نام نموده و یا وارد سایت شوید] مشاهده کنید. امتیاز هم بدید تصویر
[لینک خارجی برای کاربران مهمان مخفی است، لطفا برای مشاهده لینک ثبت نام نموده و یا وارد سایت شوید]

فقط یادتون نره برای اینکه بتونید به وسیله این دکمه ها امتیاز بدید میبایست ابتدا با مرورگرتون وارد حساب جیمیلتون شده باشید و جیمیل ست شده باشه روی مرورگر.
امیدوارم از این آموزش لذت برده باشید.

New Member
پست: 1
تاریخ عضویت: دو شنبه 1 تیر 1394, 2:23 pm

Re: اضافه کردن دکمه +1 گوگل پلاس گوشه سایت یا صفحه

پست توسط hibarfi » دو شنبه 1 تیر 1394, 2:30 pm

تصویر
خیلی ممنون
واقعا مچکرم
این دکمه رو میخواستم به صورت شناور بزارم هرکاری میکردم نمیشد
بازم ممنون

ارسال پست

بازگشت به “Web Programming”