سایت خود را بسازید ، به روش saalek110

saalek110

Well-Known Member
CSS:
@font-face {
  font-family: vazir;
  font-style: normal;
  font-weight: 100;
  src: url("fonts/Vazir-Thin.eot");
  src: url("fonts/Vazir-Thin.woff") format("woff"),
    url("fonts/Vazir-Thin.ttf") format("ttf"),
    url("fonts/Vazir-Thin.woff2") format("woff2");
}
@font-face {
  font-family: vazir;
  font-style: normal;
  font-weight: 300;
  src: url("fonts/Vazir-Light.eot");
  src: url("fonts/Vazir-Light.woff") format("woff"),
    url("fonts/Vazir-Light.ttf") format("ttf"),
    url("fonts/Vazir-Light.woff2") format("woff2");
}

@font-face {
  font-family: vazir;
  font-style: normal;
  font-weight: 400;
  src: url("fonts/Vazir-Regular.eot");
  src: url("fonts/Vazir-Regular.woff") format("woff"),
    url("fonts/Vazir-Regular.ttf") format("ttf"),
    url("fonts/Vazir-Regular.woff2") format("woff2");
}
@font-face {
  font-family: vazir;
  font-style: normal;
  font-weight: 950;
  src: url("fonts/Vazir-Black.eot");
  src: url("fonts/Vazir-Black.woff") format("woff"),
    url("fonts/Vazir-Black.ttf") format("ttf"),
    url("fonts/Vazir-Black.woff2") format("woff2");
}

body {
  font-family: vazir;
  direction: rtl;
}


کد سایت بالا ، را مقایسه کنید با سایت قبلی.
 

saalek110

Well-Known Member
استفاده از Google Fonts یا فونت های گوگل
با فونت های گوگلی که آشنا هستید؟ Google Fonts فونت های متنوع و متعددی را خصوصا برای زبان انگلیسی در اختیار شما قرار میگیرد. در میان این فونت ها، یکی دو تا فونت زیبا برای نمایش فارسی نیز به چشم میخورند. اگر بخواهید بجای فونت های آپلود شده روی هاست خود از فونت های گوگلی استفاده کنید، میتوانید از دو روش مختلف استفاده کنید. روش اول فراخوانی فونت در فایل CSS شما با دستور @import است. برای انجام این کار کافی است از کد زیر استفاده کنید :
CSS:
@import url(//fonts.googleapis.com/css?family=Open+Sans);

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

روش دوم فراخوانی فونت با استفاده از تگ link در html است

 

saalek110

Well-Known Member
نام فونت های چند کلمه ای

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

این فونت هارو بهتره برای بحث بهینه بودن درون دوبل کوتیشن گذاشت یعنی درون ” “، و اگه داخل دوبل کوتیشن قرار نگیره ممکنه در برخی مرورگرها بکل اون فونت نمایش داده نشه.

یا ممکنه حتی اگه داخل دوبل کوتیشن نزارید بازم مشکلی نداشته باشه و نشون بده ولی خب بطور کلی برای بحث بهینه و استاندارد بودن میگن باید حتما داخل دوبل کوتیشن بزارید.

همیشه سعی کنید در نام فامیلی که برای فونت تان ایجاد مینمایید هیچ فاصله ای نباشد تا در فراخوانی آن مشکلی نداشته باشید.

CSS:
p{
 font-family : "My Best Font",myfont2;
}

 

saalek110

Well-Known Member
نحوه وزن دادن به فونت ( نازکی و کلفتی فونت )
خب در ادامه آموزش نحوه اضافه کردن فونت دلخواه در سایت میخوایم یاد بگیریم که چگونه میتوان وزن یک فونت رو کم و زیاد کرد.
فونت ها میتونن وزن داشته باشند، مثلا میتونن کلفت باشن یا میتونن لاغر باشند، که ما با استفاده از ویژگی font-weight میتونیم وزن فونت مون رو مشخص نماییم.

ولی یک نکته اینجا وجود داره و خیلی هم مهمه، اینکه هر فونتی رو نمیشه همینجوری وزنش رو کم و زیاد ( چاق یا لاغر ) کرد، تنها به شرطی میتونیم اینکارو کنیم که فایل فونت خودش در وزن های مختلفی وجود داشته باشد.

مثلا ما فونت داریم که در وزن های بفرض مثال ( خیلی لاغر – لاغر – نرمال – کمی چاق – چاق – خیلی چاق ) هستند، پس باید دونه به دونه این فونت هارو که در وزن های مختلفی هستند در سایت قرار بدیم و تعریف شون کنیم.

بعدش دیگه هرکجا که خواستیم مثلا فونت مون رو پررنگ یا بولد شده یا در واقع همون حالت چاق شدش نشون بدیم باید از ویژگی font-weight استفاده نماییم.

پس در مرحله اول اونجایی که داریم فونت رو تعریف میکنیم با استفاده از ویژگی font-weight مشخص میکنیم که وزن فونت ما چه اندازه ای است ، لطفا به دستورات زیر توجه نمایید.

CSS:
@font-face {
  font-family: 'myfont2';
  src: url('myfont/font2.woff') format('woff');
  font-weight: bold;
}

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


CSS:
@font-face {
  font-family: 'myfont2';
  src: url('myfont/Font_Bold.woff') format('woff');
}

حال در مرحله ی دوم میتونیم دیگه اونجایی که میخوایم فونت رو صدا ( فراخوانی ) کنیم نیز با استفاده از همین ویژگی font-weight وزن فونت مون رو مشخص کنیم.

CSS:
p{
 font-family:myfont;
 font-weight:bold;
}
تنظیم وزن فونت بصورت عددی

ما بصورت عددی نیز میتونیم وزن فونت مون رو مشخص کنیم، یعنی مثلا بگیم وزن فونت مون ۶۰۰ باشه یا ۸۰۰ – که این عدد میتواند بین ۱۰۰ تا ۹۰۰ باشد.

CSS:
p{
 font-family:myfont2;
 font-weight:600;
}

 

saalek110

Well-Known Member
آخرین ویرایش:

saalek110

Well-Known Member
قبل از هرچیزی لازم است تا فونت خودتان را پیدا کنید . برخی فونت‌ها مثل فونت ساحل و یکان که فونت‌هایی با وزن مناسب نیز هستند ، در سطح وب بصورت رایگان جهت دانلود قرار داده شده‌اند و می‌توانید بسادگی فایل آنها را دانلود کنید . پس از دانلود یک فونت شما ممکن است چندین وزن مختلف از آن را داشته باشید ، بصورت زیر :

کد:
Light
Regular
Medium
Bold
ExtraBold

مسلما وزن Medium و همچنین Regular برای استفاده در داخل متن سایت بسیار مناسب خواهند بود . وزن‌های Bold و ExtraBold عموما برای قسمت‌های تیتر و عناوین خاص استفاده می‌شوند .

 

saalek110

Well-Known Member
لینکهای پستهای مشکوک ، مثل پست قبلی را کلیک نکنید ، ممکن است تله باشد و دستگاه شما را آلوده به ویروس و جاسوس کند.
 

saalek110

Well-Known Member
با یک کد ۳ فروم را نمایش دادن:

PHP:
             if ($h==0)
$sql = "SELECT * FROM topics WHERE topic_id=$topic_number ";
             if ($h==1)
$sql = "SELECT * FROM f1_topics WHERE topic_id=$topic_number ";
             if ($h==2)
$sql = "SELECT * FROM f2_topics WHERE topic_id=$topic_number ";

من دو تا فروم داشتم که از نوع phpbb بود و خراب شده بود. یک فروم هم امسال تابستان ۱۴۰۳ نوشتم.
امروز با کد همان فروم تابستانی ، دو فروم دیگر را هم نمایش دادم.
قسمتی از کدش را بالا نمایش دادم.


کد دریافت یک متغیر:
PHP:
$h=test_input($_GET["h"]);
اون test_input تابعی است که خودم نوشتم و در اکثر فایلهای من هست و برای امنیت است.
شامل چند تابع صاف کردن است ، قبلا در تاپیک گفتم. اگر بخواهید می توانید موقتا بدون این تابع ورودی بگیرید.



کد زیر هم لینکی است که درش متغیر $h ارسال میشه و در کد بالایی هم دریافت متغیر $h را گفتم.
PHP:
  echo"<a href='http://saalek110.is-great.net/forum/forum.php?number=$forum_id&h=$h'>".$forum_name."</a>";

در آدرس زیر که فروم من است می توانید ۳ فروم را کنار هم ببنید که همگی با یک کد نمایش داده شده.

هر فروم ، جداول فروم و تاپیک و پست و یوزر جدا دارد. یعنی ۳ تا جدول فرومز ، ۳ تا جدول تاپیکس ، ۳ تا جدول پستس و ۳ تا جدول یوزرز داریم.

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

اون دو فروم حدود ۳ تا ۴ هزار پست داشت ، که حالا به هزار پست فروم اول اضافه شد. و حدود ۴ تا ۵ هزار پست شد.
کدهای ساخت فروم را هم ، همین تابستان در همین تاپیک گفتم.

الان اواسط دی ۱۴۰۳ است. شاید بعدا مدل فروم من عوض بشه و حالت ۳ فروم را دیگه نداشته باشه.
در ضمن من اسم ستون های فروم خودم را هم نام جداول دیتابیس اون دو فروم phpbb کردم تا کوئری ها شبیه هم شوند و گیج کننده نشود.

متغیر h از فایلی به فایل دیگر ارسال میشه ، در فایل index.php برای ۳ فروم متغیر h به ترتیب صفر و یک و دو تنظیم میشه و از این فایل متغیر h به فایل فروم و فایل تاپیک و بقیه فایلها پاس داده میشه. مثلا فایل ادیت پست یا new post یا فایل delete post و غیره.
 
آخرین ویرایش:

saalek110

Well-Known Member
18 ژانویه ، سالگرد تاسیس این تاپیک است، حدود ۲۸ دیماه می شود.
حدود یک هفته دیگه است.
 

saalek110

Well-Known Member
در صفحه بعدی ، به ساختار یک سایت می پردازیم....
 
آخرین ویرایش:

saalek110

Well-Known Member
ساختار یک سایت:


در اینجا می خواهم ساختار فروم خود را به عنوان ساختار یک سایت بررسی کنم.

احتمالا برای هر سایت دیگری بشود این ساختار را استفاده کرد. حالا شاید با کمی تغییرات.



فایل اصلی ، یا صفحه اول:

فایل index.php می دونید در سایت فایل اصلی است ولی میشه در هر پوشه ، یک فایل index.php ساخت. و در هر پوشه یک سایت ساخت. فروم من هم در پوشه forum قرار دارد و فایل index.php دارد و یک فایل index.php هم در بیرون این پوشه است که فایل اصلی ساب دومین است. من دومین خریدم ، ولی فایلهای سایت خود را داخل دومین منتقل نکردم ، و فقط از دومین به ساب دومین لینک دادم.



پس در پوشه forum یک فایل index.php دارم که به باقی فایلها لینک می دهد.

من فایلهای موجود در پوشه forum را به دو دسته تقسیم می کنم تا فهمش راحت تر بشه.


اولی ، فایلهای نمایشی

دومی ، فایلهای عملیاتی






فایلهای نمایشی:

مثل فایل نمایش تالارها که اسمش هست forum.php
و فایل نمایش پستهای یک تاپیک که اسمش هست topic.php
همین صفحه ای که دارید این مطابب را درش می خوانید فایل topic.php فروم مجیدآنلاین است ، البته ساختار فروم مجیدآنلاین کمی با ساختار فروم من فرق داره ، که فعلا بحث نمی کنم.
پس من در فروم خود با فایل forum.php زیرتالارهای یک تالار و لیست تاپیکها را لیست می کنم.
لیست تالارهای اصلی در صفحه index.php داخل پوشه forum لیست شده بود.
پس فایل forum.php لیست زیرتالارهای یک تالار که در صفحه اول لیست شده بود را لیست می کند و در زیرش لیست تاپیکها لیست میشه ، این طوری:

Screenshot_۲۰۲۵-۰۱-۱۰_۱۴۱۵۵۴.jpg


در شکل بالا ، دو زیر تالار را می بینید و زیرش لیست تاپیکها را می بینید که رنگ صورتی دارد.
البته جلوی اسم هر تاپیک ، تعداد پست و تعداد بازدیدش هم نوشته شده و هر چیز اضافه ای هم میشه اضافه کرد.

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

Screenshot_۲۰۲۵-۰۱-۱۰_۱۴۱۸۵۸.jpg

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

در عکس اولی این پست روی مربع های جلوی اسم هر تاپیک که بزنیم ، اون تاپیک نمایش داده میشه. من اسم تامیک را لینک نکردم تا نوشته خوانا باشد ولی در فروم مجیدآنلاین ، اسم هر تاپیک خودش لینک است که بزنی رویش می روی داخل اون تاپیک.
حالا عکس داخل تاپیک را می ذارم:

Screenshot_۲۰۲۵-۰۱-۱۰_۱۴۲۳۲۵.jpg

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

اینجاست که فایلهای عملیاتی ، معرفی می شود. فایلهای عملیاتی ، فایلهایی هستند که هر یک کاری را برای ما انجام می دهند.
 
آخرین ویرایش:

saalek110

Well-Known Member
فایلهای عملیاتی:

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

پس در پوشه forum من دو سری فایل دارم ، فایلهای نمایشی و فایلهای عملیاتی.
 

saalek110

Well-Known Member
پوشه حاوی فایلهای کمکی:

چند تا پوشه داخل پوشه forum دارم که فایلهای نمایشی ، قطعاتی از خود را درون اون می ذارن تا فایل خودشون کوچک شود. مثلا داخل پوشه komaki یک فایل دارم به نام topic_ lister.php . البته تمامی این اسمها را الان ساختم و اسم پوشه ها و فایلها چیز دیگری است و بخاطر امنیت اسم پوشه ها و فایلهای سایت خودم را نمیگم. ولی اسمها مهم نیست و ساختار مهم است.



من با استفاده از کلمه include میام اسم اون فایل و اسم پوشه ای که اون فایل داخلشه را میگم. مثلا این طوری:


PHP:
include"esme_poshe/esme_file";

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

saalek110

Well-Known Member
ساختار فایلهای نمایشی:

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

اما فایل عملیاتی ، یک تغییر در دیتابیس انجام می دهد ، که در پست قبل بهش می پردازیم.
 
بالا