فونت های غیر استاندارد در بلاگر برای طراحی وبلاگ. فونت خوشنویسی زیبا در Blogspot, Blogger

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

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

من فکر می کنم این لحظهاین یکی از محبوب ترین روش ها برای نصب فونت سیریلیک غیر استاندارد در سایت است، اولاً به دلیل سهولت نصب و ثانیاً به دلیل پشتیبانی از مرورگرهای مختلف.

آیا به اندازه کافی شما را مجذوب کرده ام؟ وقت آن است که به جزئیات بروید.

بنابراین، این روش Cufon نامیده می شود. این توسط یک توسعه دهنده - Simo Kinnunen اختراع شد. ابتدا یک فایل مخصوص ایجاد کرد که باید به سایت متصل شود. ثانیا، او یک ژنراتور ایجاد کرد که هر فونت را به جاوا اسکریپت تبدیل می کند.

این روش به خودی خود ساده است و بعداً آن را خواهید دید. سخت ترین کار در اینجا دقیقا جستجوی فونت مورد نیاز است. و من مطمئن هستم که بسیاری از شما که کاربر فعال نیستید ویرایشگرهای گرافیکیمانند PhotoShop، به سادگی نمی‌دانند چه فونتی را باید در ژنراتور بارگیری کرد و از کجا چنین فونتی را تهیه کرد. این همان چیزی است که تصمیم گرفتم در مورد آن با جزئیات بیشتر صحبت کنم.

این راز نیست که مجموعه خاصی از فونت ها بر روی هر رایانه ای، در همان Word و سایر برنامه ها نصب شده است. ما همچنین می توانیم به طور مستقل فونت های جدید را روی رایانه خود نصب کنیم، از جمله در هر برنامه. برای این کار کافیست عبارت مورد نظر را در هر یک از موتورهای جستجو تایپ کنیم دانلود فونت های سیریلیکو مطمئن شوید که فونت هایی که پیدا کردیم با فرمت ttf. هستند.

پس از دانلود فونتی که دوست دارید با فرمت ttf. می توانید به سادگی با باز کردن آن بر روی کامپیوتر خود آن را نصب کنید.

یا با استفاده از دکمه سمت راست ماوس دستور Install را انتخاب کنید. پس از این روش، فونت در تمام برنامه های نصب شده روی رایانه، جایی که به طور کلی ارائه می شود، نمایش داده می شود. آن ها هیچ اقدام دیگری لازم نیست روش توصیف شده تضمین شده است که در ویندوز 7 کار می کند.

نصب مطلق هر فونت سیریلیک در سایت در سه مرحله

بنابراین، ما صاحب یک فونت زیبای سیریلیک غیر استاندارد شده ایم و می خواهیم آن را در سایت خود نصب کنیم. اقدامات ما چیست؟

مرحله 1

به وب سایت Cufon - cufon.shoqolate.com می رویم.
روی لینک موجود در منو کلیک کنید - دانلود. صفحه اسکریپت باز می شود. ما فقط تمام کدها را کپی می کنیم، آن را در notepad قرار می دهیم و با پسوند js ذخیره می کنیم. برای خوانندگان من یک فایل آماده آماده کرده ام که می توانید آن را در رایانه خود دانلود کنید.

مراقب باشید، از تاریخ نوشتن پست در 26 جولای 2011، نسخه اسکریپت 1.09i است. این نسخه اکنون در لینک بالا است.

در حال آپلود اسکریپت در هاست. هرکسی که در بلاگر وبلاگ می نویسد باید از قبل بداند که کجا یک فایل شخص ثالث را آپلود کند ()، من برای این کار از سایت های Google استفاده می کنم.

گام 2

ما به وب سایت Cufon به تب Generator برمی گردیم. پیش روی ما صفحه ای با تنظیمات بسیار است. صادقانه بگویم، من مطلقاً تمام تنظیمات را وارد نکردم، اما در طول آزمایش، موارد مختلفی را امتحان کردم و همیشه به نتیجه مطلوب می رسیدم.

اما در هر صورت اسکرین شات هایی با تنظیمات اولیه آماده کرده ام تا توجه شما را به نکات مهم جلب کنم.

همانطور که می بینید، یک پنجره بارگیری جداگانه برای هر نوع فونت وجود دارد:

• فونت معمولی
• فونت پررنگ
• حروف مورب معمولی
• کج با حروف درشت

من به طور کامل متوجه نشدم که چرا اینطور است، اما آن را دقیقاً در جایی بارگذاری کردم که توضیحات حداکثر فونت من را مشخص می کرد.

به عنوان مثال، اسکرین شات بارگذاری یک فونت دست نویس را نشان می دهد. او کج و کاملاً سیر است :).

در مرحله بعد، فیلد دارای موافقت نامه مجوز برجسته می شود. شما باید کادر را علامت بزنید و در نتیجه تأیید کنید که فونتی که آپلود می‌کنید اجازه استفاده در وب توسط توسعه‌دهنده همین فونت را دارد. در اینجا سوال ظریف است، متأسفانه در میان انواع مختلف فونت های مختلف در اینترنت، خود ما دقیقاً نمی دانیم از کدام فونت می توانیم استفاده کنیم و کدام را نه. بنابراین، این مورد کاملا بر وجدان شماست.

اسکرین شات بعدی

در فیلد اول نشان می دهیم که می خواهیم حروف بزرگ و کوچک و همچنین اعداد و علائم نگارشی را نمایش دهیم.

فیلد دوم به طور پیش فرض بررسی شده است، من سعی نکردم آن را حذف کنم.

در قسمت سوم حتما الفبای سیریلیک و روسی را انتخاب کنید.

من یک خط را با رنگ آبی هایلایت کردم - کسانی که فونت را برای وردپرس تولید می کنند اینجا تیک می گذارند.
و آخرین تنظیمات

من در کادر اول چیزی ننوشتم، اما فکر می‌کنم این فیلد از این نظر مفید است که اگر دامنه‌هایی را که فونت در آنها استفاده می‌شود را مشخص کنید، به سادگی در دامنه‌های دیگر کار نمی‌کند.

من این را در زمینه بالایی درک می کنم ما داریم صحبت می کنیمدر مورد اندازه فونت به طور پیش فرض. می‌توانید با تنظیم موافقت کنید، یا می‌توانید با علامت زدن کادر آن را رد کنید. من شخصا از راه های مختلفی تلاش کردم و از هر دو گزینه راضی بودم. فکر می‌کنم هم به خود فونت و هم به ایده طراح قالب بستگی دارد. مورد بعدی در پنجره 2، خود ژنراتور توصیه می کند آن را خاموش کنید، به شرطی که از اندازه فونت کوچک استفاده کنید. در صورت امکان بهتر است آخرین تیک را بزنید زیرا. به لطف این تنظیم، فایل تولید شده کوچکتر است، که بدون شک بر بارگذاری فونت برای بهتر شدن تأثیر می گذارد.

و در نهایت توافق با شرایط استفاده از ژنراتور.

در نتیجه فایل دیگری دریافت می کنیم که آن نیز در هاست آپلود می شود.

مرحله 3

تنها چیزی که باقی می ماند این است که قبل از تگ بسته شدن کد زیر را در فایل های قالب سایت مشخص کنید:

جایگزین ("h1");

همانطور که از کد می بینید، ما فونت را روی تگ عنوان h1 اعمال می کنیم. بنابراین، می توانید هر تگ دیگری را مشخص کنید تا فونت سیریلیک ما را نمایش دهد.

جایگزین ("h1");
جایگزین ("h2");
جایگزین ("p");

همچنین می توانید نه یک برچسب، بلکه یک شناسه را مشخص کنید:

cufon.replace("#mycufon");

اما این همه ماجرا نیست. اگر می خواهید از چندین فونت مختلف در یک سایت به طور همزمان استفاده کنید، برای همه فونت های جدید مرحله دوم را طی می کنیم و همه آنها را مشخص می کنیم:

Cufon.replace("h1";, ( fontFamily: "font_name_1"; ));
Cufon.replace("h2";, ( fontFamily: "font_name_2"; ));

اگر از املای صحیح فونت خود مطمئن نیستید، فایل تولید شده مربوطه را از مرحله 2 باز کنید و اطلاعات مورد نیاز خود را بیابید.

یکی که با رنگ آبی مشخص شده است، نام فونت است.
بنابراین، در یکی از وبلاگ های آزمایشی من، در ابتدا اینگونه بود.

و اینطور شد:

نحوه نصب فونت سیریلیک سفارشی در وردپرس

برای کاربران وردپرس، هنوز هم بسیار ساده تر است. البته می توانید تمام مسیری که توضیح داده شده را طی کنید و فونت نیز کار می کند، اما یک افزونه آماده به نام All-in-One Cufon نیز وجود دارد. می توانید افزونه را هم از وب سایت توسعه دهنده و هم به طور مستقیم در پنل مدیریت وبلاگ دانلود کنید.

در حال نصب افزونه. فعال کنید. به تنظیمات افزونه بروید. در بالای صفحه دو پیام هشدار وجود دارد.

اولین مورد این است که باید یک پوشه cufon-fonts در پوشه wp-content/plugins/ ایجاد کنید. برای این کار از طریق FTP وصل شوید یا به کنترل پنل هاستینگ بروید و یک پوشه جدید در پوشه افزونه ها به نام cufon-fonts ایجاد کنید. پس از آن، اولین پیام ناپدید می شود.

پیام دوم می گوید که باید فایل فونت تولید شده را در پوشه ایجاد شده قرار دهید، همان فایلی که در مرحله 2 به دست می آوریم. فایل را بارگذاری می کنیم و پیام ناپدید می شود، در حالی که فونت در تنظیمات زیر ظاهر می شود که اکنون افزونه " می بیند».

فراموش نکنید که کادر کنار فونتی را که قرار است در قالب استفاده کنید علامت بزنید. اما فونت هنوز کار نمی کند. در زیر قسمت Cufon Code وجود دارد که باید مشخص کنیم که فونت سیریلیک ما روی کدام تگ اعمال شود. در این مورد، شما باید یک کد خالی، بدون هیچ عنوان دیگر، مشخص کنید.

جایگزین ("h1");

به هر حال، ارزش گفتن دارد که اگر نصب کرده اید قالب وردپرسبا یک فونت از قبل غیر استاندارد، در حالی که املای سیریلیک ندارد، پس باید:

افزونه All-in-One Cufon را نصب کنید.

فونت تولید شده را نصب کنید.

نیازی نیست کد Cufon را در قسمت زیر وارد کنید، قاعدتاً این کد قبلاً در قالب نوشته شده است. اگر بخواهید علاوه بر فونت موجود، فونت دیگری نیز نصب کنید، همانطور که در مثال های بالا نوشتم، باید چنین ورودی ایجاد شود.

یک نکته بسیار مهم
اگر عناوین قالب را طبق مقالات من بهینه کرده اید - و پس باید بسیار مراقب باشید. اگر به خاطر داشته باشید، در همه صفحات به جز صفحه اصلی، عنوان وبلاگ در تگ است (در لینک). شما باید یک شناسه یا کلاس به این تگ اختصاص دهید، به عنوان مثال:

> اما، اگر همه چیز با دقت انجام شود، هیچ فاجعه ای رخ نخواهد داد.

یک خط کد ممکن است در قالب های مختلف متفاوت به نظر برسد. برای اطلاع از نحوه در قالب خود، مقاله را بررسی کنید، . یک ویدیوی دقیق در مورد نحوه یافتن هر خط کد وجود دارد - پس از آن می توانید تقریباً هر تغییری را در قالب سایت خود ایجاد کنید. این مهارت شما را از نیاز به جستجوی رمزها و باز کردن دستانتان رها می کند.

اگر خودتان متوجه نشدید و می‌خواهید یک فریلنسر خوب پیدا کنید که کدها را بفهمد، مقاله درباره لینک مفیددر مواقع اضطراری کجا برویم

دستورالعمل تغییر فونت در هدر سایت

و اگر زمانی برای کشف آن وجود ندارد، اما شما آن را سریعتر می خواهید برای همه چیز در مورد همه چیز، ما به وب سایت خود و برنامه کلمه (برای انتخاب فونت) نیاز داریم.

وارد پنل مدیریت سایت خود می شویم. بعد، در نوار کناری سمت چپ، کنسول را پیدا می کنیم - ظاهر- ویرایشگر

در سمت راست، لیست سبک (style.css) را پیدا کرده و آن را باز می کنیم.

عنوان وب سایت هدر h1 است. نزدیکتر به شروع قرار دارد. برای اینکه با چشمان خود جستجو نکنید، می توانید Ctrl + F را فشار دهید - یک نوار جستجو ظاهر می شود. در جستجو تایپ کنید این قسمت برای من شبیه این است:

مربع بالایی: خط تغییر فونت.

مربع پایین: خطی برای تغییر اندازه فونت.

بعداً در صورت لزوم اندازه و رنگ فونت را تغییر می دهیم.

نحوه تغییر فونت عنوان سایت

حالا تمیز را باز کنید سند ورد، کپی کنید صفحه نخستنام سایت و انتقال آن به یک سند Word، آن را انتخاب کرده و با فونت های مختلف شروع به پخش کنید. آنها در پانل بالایی در گوشه سمت چپ قرار دارند. چرا انجام آن در این برنامه راحت است - زیرا تمام تغییرات فونت در نام شما بلافاصله قابل مشاهده است. فونتی را انتخاب کنید که با نام سایت شما مطابقت داشته باشد. فونتی که حتما دوستش خواهید داشت. پس از انتخاب، نام فونت را در Worde کپی کنید.

به پنل مدیریت سایت برمی گردیم. در خط تغییر فونت (در شکل - مربع آبی بالایی)، به جای فونت پیش فرض، نام فونت انتخاب شده را وارد می کنیم.

روی «به‌روزرسانی فایل» در پایین صفحه کلیک کنید.

ما به سایت می رویم و می بینیم که آیا فونت به خوبی با بافت کلی مطابقت دارد یا خیر. اگر نه، به Word برگردید و دیگری را انتخاب کنید. همه.

نحوه تغییر اندازه فونت عنوان سایت

این کار در همان قالب ویرایشگر انجام می شود. در تصویر بالا - مربع آبی دوم. تنها کاری که باید در آنجا انجام دهید قرار دادن اعداد دیگر است - بسته به آنچه شما نیاز دارید، فونت بزرگتر یا کوچکتر می شود. ما تغییرات را ذخیره می کنیم، به سایت می رویم و می بینیم که آیا همه چیز برای ما مناسب است یا خیر.

نحوه تغییر رنگ فونت عنوان وب سایت

در آنجا انجام می شود. یک خط در بلوک بعدی وجود دارد که ما فونت و اندازه آن را تغییر دادیم. چیزی شبیه این به نظر می رسد:

برای انتخاب رنگ، می توانید از یکی از گزینه های تم استفاده کنید: کنسول - ظاهر - پس زمینه. در خط «رنگ پس‌زمینه»، می‌توانید یک رنگ را انتخاب کنید، مقدار الفبایی آن را کپی کنید و به جای آنچه بود (در مورد من 11006a#) جای‌گذاری کنید. ذخیره تغییرات. ما به سایت می رویم و تحسین می کنیم.

بنابراین، برای تغییر فونت، رنگ و اندازه، باید تنها در 3 خط ویرایشگر تغییرات ایجاد کنید. با مهارت کم، زمان بسیار کمی می برد.

عنوان زیبا و خواندنی

مطابق با روح کلی موضوع،

وبلاگ شما را جذاب تر و خاطره انگیزتر می کند.

آزمایش کنید، آنچه را که دوست دارید انتخاب کنید!

P.S. وقتی حتی تغییرات جزئی در فایل‌های ویرایشگر تم ایجاد می‌کنم، فقط در صورت لزوم، متن تغییر یافته را به طور کامل در دفترچه یادداشت کپی می‌کنم - در پوشه‌ای که فایل فشرده تم نصب شده در سایت من در آن ذخیره می‌شود. در صورتی که سایت به طور ناگهانی خراب شود و نیاز به نصب مجدد تم شود، من تمام فایل های تغییر یافته به سلیقه خود را ذخیره کرده ام. تنها هنگام نصب مجدد وردپرس یا تم ها باقی می ماند تا فایل ها به پوشه های مربوطه در هاست منتقل شوند.

در مقالات بعدی، همانطور که وبلاگ من در حال تغییر است، به همین راحتی رنگ پس زمینه، فونت های عنوان در بخش ها، مقاله ها، رنگ پیوندها - در یک کلام، هر عنصر را تغییر خواهیم داد.