BUSE - Best Ucoz Search Engine

შევქმნათ საკუთარი CMS WYSIWYG რედაქტორით.ნაწილი 2

DL1MP1K — Sat, 03 Mar 2012 07:21:34 GMT

ნაწილი № 2 - javascript WYSIWYG რედაქტორის დამატება
იმის გამო რომ მომდევნო ფაილში საკმაოდ დიდი კოდია, ჩვენ მას გავყოფთ რამოდენიმე ნაწილად, და ყველა ნაწილს დეტალურად ავხნით.

Code

secure/index.php
       ============
              include("../header.html");
// gverduis saxelis migeba motxovnis velidan
       $page = $_GET['page'] . '.txt';
if (!$_GET['page']) {
       echo("

გვერდი მითითებული არ არის

\n");
       include("../footer.html");
       exit;
       }

ჯერჯერობით ყველაფერი ნაცნობია პირველიგ აკვეთილიდან. ჩვენ ვკითხულობთ ჰედერს და ვიღებთ გვერდის დასახელებას. რადგან ჩვენ სხვა პაპკაში ვიმყოფებით (secure)ჩვენ აუცლებლად გვჭირდება ცოტა მოდიფიკაცია გაუკეთოთ ბმულებს ფუტერამდე და ქუდამდე.

Code

if ($_POST['page']) {
       $handle = fopen("../pages/$page", 'w');
       fwrite($handle, $_POST['page']);
       fclose($handle);
       echo($_POST['page']);
       include("../footer.html");
       exit;
       }

იქიდან გამომდინარე რომ რედაქტორი საშვალებას გვაძლევს დავარედაქტიროთ და იგივე სკრიპტი დაამუშავებს რეზულტატებს, ზემო თოცემული კოდი შეამოწმებს გამოვეაქვეყნეთ თუ არა გვერდი. თუკი გამოვაქვეყნეთ გვერდი კონტენტით - მაშინ სკრიპტი ხნის ფასილს (რომელიც მითიტებული ქონდა მოთხოვნაში), გადაწერს მას, ხურავს და გვაჩვენებს ჩვენ განახლებულ ფაილს. ბოლოს კი გამოაქვს.

Code

if (file_exists("../pages/$page")) {
   $FILE = fopen("../pages/$page", "rt");
   while (!feof($FILE)) {
   $text .= fgets($FILE);
   }
   fclose($FILE);
   } else {
   echo("

ახალი გვერდი: $page

\n");
$text = "

";
}

თუკი ჩვენ მიუთითეთ გვერდი რომელიც არსებობს, მაშინ სკრიპტი გარდაქმნის ტექსტს ცვლადზე $text. თუ არ არსებობს, მაშინ სკრიპტი გვეტყვის რომ ჩვენ ვქმნით ახალ გვერდს და ცვლადი $text შეიძნებს უბრალო პარაგრაფის სახეს (
).

შემდეგ ჩვენ ვუერთებთ TinyMCE javascript რედაქტორს. Важно при подключении следитьმნიშვნელოვანია მიერთებისას გამოვიყენოთ სწორი ბმულები თავად რედაქტორამდე.

Code

echo <<< EOM


       EOM;

როგორც წესი javascript ჩვენ ვტვირთავთ ხოლმე ჩვენი გვერდის ქუდში. მაგრამ ჩვენს შემთხვევაში ქუდზე პასუხისმგებელია 1ფაილი , რომელიც იტვირტება საიტის ყველა გვერდთან. სექცია "init" შეიცავს რედაქტორის ყველა ნასტორიკას ველი "mode: textareas" ნიშნავს, რომ ყველა ტექსტური ველი გვერდზე გახდებიან TinyMCE WYSIWYG ველები (ანუ მათი რედაქტირება შესაძლებელი იქნება WYSIWYG სტილით). TinyMCE-ის ოფიციალურ სატიზე დიდი ინფორმაციაა ნასტროიკებზე.

Code

$this_page = $_SERVER['PHP_SELF'];
$query_string = $_SERVER['QUERY_STRING'];
echo("\n");

ზემოთ მოცემული კოდი ქმნის ფორმას, ტექსტურ ველს და ღილაკს "შენახვა". "htmlspecialchars($text)" რომელსაც გამოიტანს ცვლადიდან $text მთელი ტექსტი ქმნის ყველა სპეციალურ სიმბოლოს HTML კოდში. ეს კეთდება იმისათვის , რომ HTML,რომელიც იმყოფება ტექსტურ ფაილებში არ კომფლიქტობდეს HTML გვერდთან. ამის შემდეგ მირებული ტექსტი გადაეცემა ტექსტურ ველს. მას შემდეგ რაც დავაჭერთ "შენახვა", სკრიპტი მიმართავს ამავე გვერდს ამავე მოთხოვნით, მაგრამ ამჯერად შეცვლილი ინფორმაციით.

Code

include("../footer.html");
?>

და ბოლოს არ დაგვავიწყდეს ფუტერი.

პ.ს
აი ჩვენ შევქმენით უბრალო CMS ფაილებზე.ის არ არის უნაკლო და საჭიროებს დამუშავებასა და დახვეწას, მაგრამ უბრალო საიტებისთვის გამოდგება. იმედი მაქვს ამ გაკვეთილში თქვენ სასარგებლო ინფორმაციას მიიღებთ და შეისწავლით. ველი კომენტარებსაც

შევქმნათ საკუთარი CMS WYSIWYG რედაქტორით.ნაწილი 1

DL1MP1K — Sat, 03 Mar 2012 07:19:08 GMT

ამ გაკვეთილში მე გასწავლით როგორ გამოყოტ ერთმანეთისგან თქვენი ტექსტები და დიზაინი, ამასთანავე როგორ დაამატოთ WYSIWYG რედაქტორი ტექსტების შესაცვლელად.

იმისთვის რომ ეს გაკვეთილი თქვენთვის გასაგები იყოს საჭიროა საბაზო ცოდნა:
- HTML
- PHP საფუძვლები
- ფორმები (და POSTing)
- მოთხოვნების სტრიქონი ($_GET)

ამ გაკვეთილში ვისაუბრებთ:

- ქუდისა და ფოტერის გამოყოფაზე საიტის შემცველობისგან
- ტექსტიანი გვერდის შაბლონის შექმნაზე
- javascript WYSIWYG რედაქტორის დამატებაზე.

განხილული იყო ბევრი javascript რედაქტორები, მათგან ყველაზე მეტად მომეწონა TinyMCE. ის უფასოა და შესაძლებელია დავამატოთ ნებისმიერ ტექსტურ ველს. დამატების შემდეგ შესაძლებელია მისი დარეადქტირება MS Word-სტილში. ეს რედაქტორი ძალიან მოსახერხებელი და ფუნქციონალურია და უფრო ღრმა შესწავლის შემდეგ შესაძლებელია მისი რეალიზება. მასში ბევრია ჩაშენებული ფუნქციები, დაწყებული ცხრილის შემნიდან დასრულებული მთელ ეკრანზე რედაქტირებამდე.

ნაწილი №1 - ქუდის და ფუტერის გამოყოფაგვერდის ძირითადი ნაწილისგან

შესაძლოა ბევრმა თქვენგანმა უკვე გააკეთა ეს მოქმედება ოდესმე. მთავარი დავალება ამ ყველაფერში - არის შევქმნათ ცალკეული ფაილები ქუდისთვის და ფუტერისთვის, რაც შემდგომში ნამდვილად დაგეხმარებათ თქვენ საიტის ნსბისმიერი გვერდის რედაქტირებისას (განსაკუთრებით თუ ისინი ბევრია). ქუდში როგორც წესი მოთავსებულია ლამაზი სურათი და ნავიგაციის ელემენტები, ზოგჯერ გამოყენებულია სხვადასხვა DIV-ებისაიტის ამ ნაწილის სწორი განლაგებისთვის. ფუთერში კიდე ყველა DIV-ბი იხურება და ხშირად ისმევა ინფორმაცია კოპირაიტზე.

ქუდის მაგალითი:

Code

header.html
       ===========

       Link 1 |
       Link 2 |
       Link 3 |
       Link 4

შეატყობდით ალბად რომ თეგები DIV, BODY და HTML არ არიან დახურულები. ეს გაკეთდება ფუტერში.

ფუტერის მაგალითი:

Code

footer.html
===========

საიტი შექმნილია სპეციალურად geodles.com-სთვის

ახლა ამ ფაილების საიტზე გამოსაყენებლად საჭიროა კიდევ ერთი ფაილის შექმნა

Code

index.php
===========
include("header.html");
// aq chajdeba saitis shemcveloba
include("footer.html");
?>

თუ თქვენ მზგავს სტრუქტურას გამოიყენებთ საიტის ყველა გვერდისთვის, მაშინ ბევრად ადვილი იქნება მისი განახლება და მოვლა. თუ თქვენ მოგინდებათ დიზაინში ცვლილების შეტანა ან ნავიგაციაში ახალი ლინკის დამატება, თქვენ დაგჭირდებათ შეცვალოთ მხოლოდ header.html და ცვლილებები გავრცელდება საიტის ყველა გვერძე.

ნაწილი მეორე №2 - კონტენტიანი გვერდის შაბლონის შექმნა

იქიდან გამომდინარე რომ ყველა საიტზე გვერდების უმრავლესობა იდენტურია (განსხვავება მხოლოდ კონტენტშია), რაში გვჭირდება უამრავი php ფაილი? ჩვენი საიტის ყველა გვერდისთვის, ჩვენ უკვე გვაქვს ფუნქცია "include" ქუდისთვის, ფუტერისთვის და ადგილი კონტენტისთვის. ეს ნორმალურია თუ თქვენ გაქვთ რამოდენიმე გვერდი.მაგრამ რა მოხდება მაშინ თუ ჩვენ გადავწყვეტთ შევქმნათ ას ან უფრო მეტ გვერდიან საიტიგანსხვავებული კონტენტით? ამის შექმნამ შეიძება იმდენი დრო წაგვართვას რომ გადაიფიქროთ კიდეც მისი შექმნა :). ფოკუსი იმაშია რომ, თქვენ გქონდეთ ერთი კონტენტიანი გვერდი და ბევრი ტექტური ფაილი (1 ფაილი= 1გვერდს). სევქმნათ პაპკა სახელად "pages" ან რამე თქვენი სურვილის მიხედვით და მოვათავსოთ მასში .txt ფაილი, რაც ეხება ჰედერსა და ფუტერს.

ასეთი ტექსტური ფაილის მაგალითი:

Code

news.txt
===========

siaxle

იქიდან გამომდინარე რომ ყველა საიტზე გვერდების უმრავლესობა იდენტურია (განსხვავება მხოლოდ კონტენტშია), რაში გვჭირდება უამრავი php ფაილი? ჩვენი საიტის ყველა გვერდისთვის, ჩვენ უკვე გვაქვს ფუნქცია "include" ქუდისთვის, ფუტერისთვის და ადგილი კონტენტისთვის. ეს ნორმალურია თუ თქვენ გაქვთ რამოდენიმე გვერდი.მაგრამ რა მოხდება მაშინ თუ ჩვენ გადავწყვეტთ შევქმნათ ას ან უფრო მეტ გვერდიან საიტიგანსხვავებული კონტენტით? ამის შექმნამ შეიძება იმდენი დრო წაგვართვას რომ გადაიფიქროთ კიდეც მისი შექმნა :). ფოკუსი იმაშია რომ, თქვენ გქონდეთ ერთი კონტენტიანი გვერდი და ბევრი ტექტური ფაილი (1 ფაილი= 1გვერდს). სევქმნათ პაპკა სახელად "pages" ან რამე თქვენი სურვილის მიხედვით და მოვათავსოთ მასში .txt ფაილი, რაც ეხება ჰედერსა და ფუტერს.

როგორ გამოვიყენებთ ამას ჩვენს საიტზე? პასუხი ძალიან მარტივია: მოთხოვნების გადაცემის გზით, რომელიც სკრიპტს შეატყობინებს კონკრეტული გვერდის ნახვის სურვილის შესახებ.

შევხედოთ ჩვენს განახლებუულ ფაილს index.php:

Code

index.php
   ===========
    include('header.html');
// davayeot $page  "home.txt" ze tu sxva parametri motxovnili ar aris
   if ($_GET['page']) {
   $page = $_GET['page'] . '.txt';
   } else {
   $page = 'home.txt';
   }
// shevamocmot faili arsebobaze da chavrtot is.
   if (file_exists("pages/$page")) {
   include("pages/$page");
// tu faili ar arsebobs - gamovitanot shetyobineba shecdomaze.
   } else {
   echo("

მოთხოვნილი გვერდი ვერ მოიძებნა

\n");
}
include('footer.html');
?>

არაფერი გადასარევი და რთული ამაში არ არის ნებისმიერ თქვენთაგანს შეუძლია ამის გაკეთება, ახლა ჩვენ უკვე გვაქვს უამრავი ტექსტური (რომელშიც ინახება მხოლოდ კონტენტი, რომელიც შეგვიძლია სურვილისამებრ შეცვალოთ მარტივად) და მხოლოდ ერთი php ფაილი.

ძალიან გამოგვადგებოდა ფუნქცია, რომელიც ტექსური ინფორმაციის მოცულობას დაყოფდა რამოდენიმე ნაწილად, ამასთანავე დაამატებდა ბმულს"წინა" და"მომდევნო" გვერდებისთვის.მოდით გავაკეთოთ ესეც! კოდის შემდეგი ბლოკი შეგვიძლია ჩავსვათ სურვილისამებრ პირდაპირ 'include("pages/$page")'.
-ს შემდეგ ეს სკრიპტი ეძებს ფაილს სახელის დაბოლოებებით _გვერდი(ციფრი) (მაგალითად: news_1.txt, news_2.txt, news_3.txt და ასე შემდეგ - ეს შემნის სამ გვერდს რომელიც ერთმანეთზე იქნებიან გადალინკულები ღილაკებით "წინა" და "მომდევნო")

Code

if (preg_match("/^(.*_page)(\d+)/", $page], $matches)) {
$prev_page = $matches[2] - 1;
$next_page = $matches[2] + 1;
echo("

");
if (file_exists("pages/" . $matches[1] . $prev_page . ".php")) {
echo(" "?page={$matches[1]}$prev_page\">წინა გვერდი");
$prev = 1;
}
if (file_exists("pages/" . $matches[1] . $next_page . ".php")) {
if ($prev) {
echo(" ");
}
echo(" "?page={$matches[1]}$next_page\">მომდევნო გვერდი");
}
echo("

");
}