امین بهشتی

Design Tutorials

طراحی وِب و گرافیک

افزودن محتوی پیش‌فرض به نوشته‌ها در وردپرس

فرض کنیم یک متن یا تبلیغی دارید که دوست دارید آن را در آخر تمام نوشته‌های وب‌سایت یا وب‌لاگ‌تان نمایش دهید. در این آموزش تکه کدی را برای‌تان معرفی خواهم کرد که با کمک آن به راحتی می‌توانید این عمل را انجام دهید.

کافیست کد زیر را در فایل functions.php پوسته‌تان اضافه کنید و محتوی دلخواه خود را در آن جایگزین کنید.

function example_append_post_content( $content ) {
 
   $html = '<div class="post-suffix">';
   $html .= 'این متن به آخر نوشته‌ها اضافه خواهد شد.';
   $html .= '</div>';
 
   $content .= $html;

 
    return $content;
 
}
add_filter( 'the_content', 'example_append_post_content' );

توضیح کد بالا :

در این کد محتوی دلخواه در یک متغیر بنام html$ ذخیره می‌شود و سپس به انتهای متن نوشته اضافه می‌گردد.

حال فرض کنیم فقط می‌خواهید متن دلخواه‌تان در نوشته‌های تکی نمایش یابند. در این صورت کافیست یک if به کد بالا اضافه کنید.

function example_append_post_content( $content ) {
  
    if ( is_single() ) {
  
        $html = '<div class="post-suffix">';
        $html .= 'این متن به آخر نوشته‌ها اضافه خواهد شد.';
        $html .= '</div>';
  
        $content .= $html;
  
    }
  
    return $content;
  
}
add_filter( 'the_content', 'example_append_post_content' );

از این روش می‌توانید برای اضافه کردن انواع محتوی مانند تبلیغ، بیوگرافی نوسینده نوشته، لینک‌های اشتراک‌گذاری در شبکه‌های اجتماعی و بسیاری موارد دیگر استفاده کنید.

منبع

درباره امین بهشتی

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

    • ببینید وقتی کد زیر را می‌نویسیم:

      $content = $html; 
      

      یعنی که محتوای html$ را در content$ قرار بده. تو این حالت اگر content$ قبلاً محتوایی داشت پاک خواهد شد و محتوای html$ جایگزین می‌شود.

      اما وقتی قبل از علامت مساوی یک نقطه می‌گذاریم، یعنی که محتوای html$ را به آخر محتوای content$ اضافه کن.

      سپاس

    • با سلام،
      فونتی که برای عناوین سایت استفاده شده، فونت Droid Arabic Naskh Arabic هست که می‌توانید از آدرس زیر به آن درسترسی داشته باشید:
      https://www.google.com/fonts/earlyaccess

      برای نحوه استفاده از آن هم در مورد “استفاده از فونت‌های شخصی” یا “use custom fonts css” یکم گوگل کنید، آموزش‌هایی می‌توانید پیدا کنید.

      سپاس

      • بسیار ممنونم
        البته فقط فرمت ttf بود و در اکسپلورر اجرا نمیشد، که در سایت onlinefontconverter.com تبدیل به فرمتهای woff otf eot کردم و در لوکال قرار دادم که به شکل ناباورانه ای اجرا شد. جتما شما هم همچین کاری کردید؟

        من فونت AdobeArabic را خیلی میپسندم ولی متأسفانه با این فونت هم همین مشکل را دارم که به جز در فایرفاکس در سایر مرورگرها اجرا نمیشه، و تا کنون راه چاره ای برای این مشکل پیدا نکردم و این تبدیل ها هم کارساز نبود. آیا شما راه حلی دارید؟

        • نسخه وب این فونت‌ها توسط خود گوگل ساخته شده و بصورت آماده و رایگان قابل دسترسی هست.
          در آدرسی که قبلاً دادم لینک یک فایل css برای هر فونت وجود دارد که در آن وب فونت‌ها لینک شده‌اند. یعنی فایل زیر :

          http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css
          

          شما کافیست در ابتدای فایل css پوسته‌تان کد زیر را وارد کنید :

          @import url(http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css);
          

          بعد از کد زیر برای تنظیم فونت بخش‌های دلخواه قالب‌تان استفاده کنید :

          font-family: 'Droid Arabic Naskh', serif;
          

          در مورد مشکل با مرورگرها (بجز فایرفاکس) دقیق نمی‌دونم. جدیداً برای من هم در گوگل کروم این فونت‌ها نمایش پیدا نمی‌کنند.
          حالا باید بررسی کنم ببینم جریان چیه؟!
          نتیجه‌اش را اگر شد اینجا میزارم.
          سپاس

  1. چطور میشه براش قاب تعریف کرد؟ میدونم که از طریق css امکان پذیر اما متاسفانه از css چیزی نمیدونم. میشه یک نمونه قالب براش تعریف کنید و کدش رو قرار بدید؟ اینطوری از متن اصلی مطلب هم جدا میشه هم اینکه بنظر من شکیل تر میشه!

    ممنون

    • یک راه درست این هست که شما در ساختار HTML به بخش‌های مختلف متن یا تبلیغ یا هر چیزی که می‌خواهید اضافه کنید، کلاس تعریف کنید و سپس در فایل شیوه‌نامه مربوط به پوسته‌تان (در بخش انتهایی آن) با کدهای CSS اقدام به استیال‌دهی کنید.

      به عنوان مثال در کد بالا که معرفی کردم، برای متنی که به انتهای نوشته‌ها اضافه می‌شود کلاس post-suffix در نظر گرفته شده است.
      حالا اگر می‌خواستیم برای این یک استایل بدیم باید بریم به فایل شیوه‌نامه پوسته (style.css) و کد CSS مورد نظرمان را وارد کنیم.
      مثلاً :

      .post-suffix {
      	padding: 10px;
      	border: 1px solid #ccc;
      	text-align: center;
      }
      

      اول باید ساختار محتوایی که می‌خواهید اضافه کنید مشخص بشه تا بعد برای آن ساختار مثال‌های آورده شه.

      • کلاس کدهای php رو از کجا میشه متوجه شد؟ و اینکه زمانی که css ای برای کدی خاص انتخاب میکنیم چطور میتونیم به کد css بفهمونیم که این تکه css برای فلان خط از کد php در فلان قالب هست ؟!

        چون فکر میکنم کدهای زیادی با یک کلاس در یک قالب استفاده می شه و ما نمیخوایم یک استایل خاص برای تمام کدهایی که از اون کلاس استفاده میکنند اجرا بشه! درسته؟!

        • من یک توضیحی در این مورد بهتان می‌دم اما بهتره برای درک بهتر این موضوع یک مطالعه‌ای درباره HTML و CSS انجام بدید.

          ببینید اول باید ساختار صفحه‌مان را در قالب HTML بنویسیم که در این ساختار بخش‌های مختلف سایت را با دادن آی‌دی و کلاس دلخواه، می‌سازیم. سپس با کدهای CSS این بخش‌های سایت را استایل‌دهی می‌کنیم. حالا در نوشتن کدهای CSS باید با یک سری روش‌های آدرس‌دهی تنظیم کنیم که این استایل‌ها به کدام بخش سایت مربوط هستند.
          البته ممکن است یک طراح برای هر بخش یک کلاس متفاوت تعیین کند که در این صورت آدرس‌دهی بخش‌ها راحت میشه اما کدهای CSS زیادی باید نوشته شه و راه مناسبی نیست!!!
          توصیه می‌کنم آموزش‌های HTML/CSS را گوگل کنید و کمی مطالعه کنید.

          سپاس

  2. سلام.خدا قوت. یک سوال بی ربط به موضوع.ضمن خداقوت درخواستی داشتم میتونید برا ما انجام بدین.من قالبی(پوسته) رو دانلود و رو هاستم قرار دادم.اکثر مواردی که شده انجام دادم ولی مثل قالب اصلی در نمیاد.نمیدونم چطوریه.من زیاد طراحی بلد نیستم .
    این سایت من http://akschi.ir/
    این هم قالب اصلی http://themes.designcrumbs.com/stocky/#

    میتونید کمک کنید .ممنون میشم. شد خبری بدین

  3. مهندس جان ممنون از آموزش خوبی که گذاشتی.

    به روشی که گفتی متن مورد نظرم رو گذاشتم، قالبم هم صحیفه هست
    فقط دوتا سوال:

    ۱- فونت نوشته ای که نشون داده میشه رو چطور میشه تعییر داد یا سایز نمایشش رو بزرگتر کرد؟

    ۲- چون توش نوشتم برای اطلاع از سایر برنامه های سایت، به کانال تلگرام بپیوندید، کلمه کانال تگرام رو چطوری لینک بگذارم رووش، که وقتی در پانویس مطلب قرارش دادیم ( یعنی همین متن ثابت زیر همه پست ها ) ، لینکش کار کنه و کاربر با کلیک روی کلمه کانال تلگرام، به کانالمون بیاد ؟

    ممنونتم

درصورت تمایل برای ارسال دیدگاه‌تان از فرم زیر می‌توانید استفاده کنید ↓

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

(الزامی*)

می‌توانید از نشان و برچسب‌های HTML زیر در متن دیدگاه‌تان استفاده کنید:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>
(الزامی*)
(اختیاری)

لطفاً جای‌خالی در معادله زیر را پر کنید: * Time limit is exhausted. Please reload the CAPTCHA.