سلام!
در این مقاله میخوام تجربهام از ساخت سایت شخصی با وردپرس رو با شما به اشتراک بذارم؛ از انتخاب تکنولوژیها گرفته تا چالشهای فنی و انتخاب پلاگینهای سبک و کاربردی.
اگر شما هم به فکر راهاندازی سایت شخصی هستید یا میخواید بدونید پشت صحنهی این سایت چه خبره، این نوشته میتونه براتون مفید باشه.
از چه تکنولوژیهایی استفاده شده؟
فرانتاند
در طراحی فرانتاند، از HTML، CSS و JavaScript خام استفاده کردم؛ بدون استفاده از فریمورکهایی مثل React یا Vue.
بزرگترین چالش این بود که بدون کمک ابزارهای کامپوننتمحور، ساختار کدها رو طوری بنویسم که قابل نگهداری و توسعهپذیر باشه.
بکاند
از اونجا که سایت روی وردپرس ساخته شده، بکاند با PHP نوشته شده. برای ساخت قالبهای مختلف مثل صفحات آرشیو و نوشته تکی، استفاده از توابع وردپرس ضروری بود.
چرا وردپرس؟
وردپرس انتخاب مناسبی برای پروژههایی با زمان محدود و نیاز به پنل مدیریت سادهست.
در این سایت، وردپرس وظیفه مدیریت محتوا، ترجمه، ارتباط با دیتابیس و بهینهسازی سئو رو برعهده داره.
طراحی قالب اختصاصی
ساختار CSS
برای طراحی قالب از پایه، از CSS Grid برای چیدمان اصلی سایت و از Flexbox برای اجزای داخلی استفاده کردم.
بعد از طراحی نسخه اولیه، با Tailwind CSS آشنا شدم. تجربه کار با Tailwind واقعاً لذتبخشه؛ چون کنترل بیشتری روی ظاهر اجزا دارم و سرعت طراحی هم بیشتر میشه. اگه بخوام قالب دیگهای طراحی کنم، حتماً از Tailwind استفاده میکنم.
ویژگیهای جدید CSS
قابلیتهایی مثل استفاده از متغیرها، تو در تو نویسی و media queryهای بهبودیافته در CSS مدرن، کمک زیادی به تمیزی و کوتاه بودن کدها کرد.
برای پروژههای سبک مثل این سایت، همین امکانات باعث شد نیازی به SASS یا سایر پیشپردازندهها نداشته باشم.
تجربه چندزبانه کردن سایت
ترجمه سایت یکی از چالشهای مهمم بود. در نهایت از دو پلاگین زیر استفاده کردم:
- Loco Translate: برای ترجمه رشتههای قالب
- Polylang: برای مدیریت محتوای ترجمهشده (صفحات، مقالات و…)
هیچ پلاگینی پیدا نکردم که بهتنهایی هر دو مورد رو بهخوبی انجام بده، اما ترکیب این دو راهکار مؤثری بود.
سئو سایت با Rank Math
برای سئو، از نسخه رایگان پلاگین Rank Math SEO استفاده میکنم. تجربهی راحتتری نسبت به سایر پلاگینها داشتم و امکاناتش برای سایت شخصی من کاملاً کافی بود.
ورژن کنترل و استقرار با Git
برای مدیریت نسخهها از Git استفاده کردم و ریپازیتوری رو روی GitHub گذاشتم.
در cPanel، پروژهام رو به گیتهاب وصل کردم و با هر push، بهراحتی قالب روی هاست آپدیت میشه. این روش سریعتر و حرفهایتر از آپلود دستی فایلهاست.
کش کردن سایت
برای کش، از پلاگین LiteSpeed Cache استفاده کردم که توسط هاست پشتیبانی میشد. هنوز تنظیمات حرفهای خاصی روش اعمال نکردم، اما در آینده بررسی میکنم.
جمعبندی پلاگینها
در این سایت فقط از 4 پلاگین استفاده شده:
- Rank Math SEO
- Loco Translate
- Polylang
- LiteSpeed Cache
استفاده از پلاگینهای کمتر، به صورت مستقیم روی سرعت و عملکرد سایت تأثیر داره. طراحی قالب اختصاصی هم باعث شد از المانهای اضافهای که صفحهسازهایی مثل المنتور به سایت اضافه میکنن، دور بمونم.
برای مثال، المنتور با وجود محبوبیتش، المانهای زیادی به DOM سایت اضافه میکنه که ممکنه باعث کاهش سرعت لود بشه.
سخن پایانی
ساخت سایت شخصی با وردپرس برای من تجربهای عمیق و آموزنده بود. دغدغه اصلیم همیشه سرعت و بهینه بودن سایت بوده و این پروژه بهم نشون داد که چقدر ساخت قالب اختصاصی میتونه روی عملکرد نهایی سایت تأثیرگذار باشه.
اگر قصد دارید سایتی سبک، سریع و قابل کنترل داشته باشید، حتماً به ساخت قالب اختصاصی فکر کنید.