पूर्वी आपण युजरकडून अभिप्राय (feedback) घेण्यासाठी फॉर्मचा उपयोग कसा करता येतो हे पाहिले होते. त्यावेळी फॉर्मची माहिती पाठविण्यासाठी पीएचपी प्रोग्रॅमचा वापर करावा लागतो हेही सांगितले होते. आता असा वापर कसा करता येतो हे पाहूया.
समजा आपले कॉम्प्युटर पार्ट चे दुकान आहे व आपल्याला इंटरनेटवरून त्याच्या विक्रीसाठी वेबसाईट करावयाची आहे. html form व पीएचपीच्या साहाय़्य़ाने अशी वेबसाईट आपल्याला करता येईल.
.
यासाठी प्रथम फॉर्म भरण्यासाठी order.html हे वेबपेज करावे. यात मराठी युनिकोड अक्षरे लिहिता यावीत यासाठी मेटा टॅगमध्ये UTF-8 चा उल्लेख केला आहे.खालील प्रोग्रॅम पहा.
हे पेज स्क्रीनवर खालीलप्रमाणे दिसेल.
फॉर्ममध्ये भरलेली माहिती name,email,item आणि quantity फॉर्मवरून सर्व्हरकडे पोस्ट झाली की ती पीएचपी च्या $_POST या व्हेरिएबलमध्ये तात्पुरती साठविली जाते. process.php मध्ये $name, $email,$item व $quantity या व्हेरिएबलमध्ये साठविली जाते.
$name=$_POST['name'];
$email=$_POST['email']
$quantity = $_POST['quantity'];
$item = $_POST['item'];
वरील पीएचपी प्रोग्रॅम खालीलप्रमाणे युजरकडे प्रतिसाद पाठवेल.
वरील उदाहरणात form साठी order.html आणि व php process साठी process.php या दोन प्रोग्रॅम वापरले आहेत.
आता याप्रमाणे आपण कोणत्याही प्रकारचा फॉर्म डिझाईन करून युजरची माहिती पीएचपी प्रोग्रॅमच्या साहाय्याने मिळवू शकाल.
Tuesday, March 8, 2011
Monday, March 7, 2011
पीएचपी भाग-५ Server Information
ज्या सर्व्हरवर पीएचपी फाईल आहे त्या सर्व्हरचे नाव, फाईलचा पत्ता, सर्व्हरचा IP address तसेच http विषयीची सर्व माहिती मिळविण्यासाठी खालील पीएचपी प्रोग्रॅम वापरता येतो.
या उदाहरणातील पीएचपी फाईल स्थानिक सर्व्हरवर ठेवलेली आहे व ब्राउजरमध्ये ती उघडली असता खालील उत्तर येते.
-----------------------------
Server Name - localhost
Script name - /use_of_php/server_info.php
Remote Server Address - 127.0.0.1
HTTP User Agent - Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.15) Gecko/20110303 Firefox/3.6.15 ( .NET CLR 3.5.30729)
-----------------------------
वरिल प्रोग्रॅम टाईप करून आपल्या सर्व्हरवर ठेवून काय उत्तर येते ते पहा.
या उदाहरणातील पीएचपी फाईल स्थानिक सर्व्हरवर ठेवलेली आहे व ब्राउजरमध्ये ती उघडली असता खालील उत्तर येते.
-----------------------------
Server Name - localhost
Script name - /use_of_php/server_info.php
Remote Server Address - 127.0.0.1
HTTP User Agent - Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2.15) Gecko/20110303 Firefox/3.6.15 ( .NET CLR 3.5.30729)
-----------------------------
वरिल प्रोग्रॅम टाईप करून आपल्या सर्व्हरवर ठेवून काय उत्तर येते ते पहा.
पीएचपी भाग-४ Strings
पीएचपी Strings
string म्हणजे अक्षरसंच वा समूह. एका अक्षरापासून ते अनेक शब्दांचा समूह वा ओळी string प्रकारच्या व्हेरिएबलमध्ये साठविता येतात. हा एक array च असतो. या string व्हेरिएबलमध्ये बदल करण्यासाठी तसेच त्यातील अक्षरे वा अक्षरसमूहांवर संस्कार करण्यासाठी पीएचपीमध्ये काही सुविधा आहेत.
$name="Dnyandeep Foundation";
यातील सर्व अक्षरे कॅपिटल करण्यासाठी strtoupper($name) तर सर्व अक्षरे दुसर्या लिपीतील करण्यासाठी strtolower($name) ही फंक्शन वापरता येतात.
ucwords("webdesign course") यामध्ये पहिले अक्षर कॅपिटल केले जाते यालाच Title case असे म्हणतात.
string मधील काही अक्षरे वा शब्द बदलावयाची असल्यास खालील फंक्शन वापरता येते.
str_replace(search, replace, String) यात search म्हणजे जुना ( string मध्ये असलेला) अक्षरसमूह, replace म्हणजे नवा अक्षर समूह आणि String म्हणजे मूळ अक्षर समूह.
strpos($name, "p") या फंक्शनचा अर्थ $name या अक्षरसमुहातील p चे स्थान.यात पहिल्या अक्षराचे स्थान 0 असते हे लक्षात ठेवले पाहिजे.
वरील string functionsचा उपयोग खालील प्रोग्रॅममध्ये दाखविला आहे.
याचे उत्तर खालीलप्रमाणे येते.
-----------------------------------------------
Dnyandeep Infotech Pvt. Ltd.
Converted to capital letters - DNYANDEEP INFOTECH PVT. LTD.
Converted to lower letters - dnyandeep infotech pvt. ltd.
Converted to Title Case - Webdesign Course
Original name - Dnyandeep Infotech Pvt. Ltd.
New name - Dnyandeep Foundation
Location of 'p' in Dnyandeep Infotech Pvt. Ltd. - 8
---------------------------------------------------------------------
string म्हणजे अक्षरसंच वा समूह. एका अक्षरापासून ते अनेक शब्दांचा समूह वा ओळी string प्रकारच्या व्हेरिएबलमध्ये साठविता येतात. हा एक array च असतो. या string व्हेरिएबलमध्ये बदल करण्यासाठी तसेच त्यातील अक्षरे वा अक्षरसमूहांवर संस्कार करण्यासाठी पीएचपीमध्ये काही सुविधा आहेत.
$name="Dnyandeep Foundation";
यातील सर्व अक्षरे कॅपिटल करण्यासाठी strtoupper($name) तर सर्व अक्षरे दुसर्या लिपीतील करण्यासाठी strtolower($name) ही फंक्शन वापरता येतात.
ucwords("webdesign course") यामध्ये पहिले अक्षर कॅपिटल केले जाते यालाच Title case असे म्हणतात.
string मधील काही अक्षरे वा शब्द बदलावयाची असल्यास खालील फंक्शन वापरता येते.
str_replace(search, replace, String) यात search म्हणजे जुना ( string मध्ये असलेला) अक्षरसमूह, replace म्हणजे नवा अक्षर समूह आणि String म्हणजे मूळ अक्षर समूह.
strpos($name, "p") या फंक्शनचा अर्थ $name या अक्षरसमुहातील p चे स्थान.यात पहिल्या अक्षराचे स्थान 0 असते हे लक्षात ठेवले पाहिजे.
वरील string functionsचा उपयोग खालील प्रोग्रॅममध्ये दाखविला आहे.
याचे उत्तर खालीलप्रमाणे येते.
-----------------------------------------------
Dnyandeep Infotech Pvt. Ltd.
Converted to capital letters - DNYANDEEP INFOTECH PVT. LTD.
Converted to lower letters - dnyandeep infotech pvt. ltd.
Converted to Title Case - Webdesign Course
Original name - Dnyandeep Infotech Pvt. Ltd.
New name - Dnyandeep Foundation
Location of 'p' in Dnyandeep Infotech Pvt. Ltd. - 8
---------------------------------------------------------------------
पीएचपी - भाग-३
पीएचपी Array
Array म्हणजे एका माळेतील मण्यांप्रमाणे एकाच व्हेरिएबलच्या नावावर अनेक संख्या वा शब्द साठविणे. उदाहरणार्थ
$numbers=array(34,67,4,10,89);
$names[0]="Suresh";
$names[1]="Ashok";
$names[2]="Shivaji";
$names[3]="Neela";
$days=array("Monday", "Tuesday","Wednesday","Sunday");
$salaries["Joshi"] = 20000;
$salaries["Patil"] = 35000;
$salaries["Shah"] = 16000;
ही सारी array ची उदाहरणे आहेत. याचा प्रोग्रॅम खाली दाखविला आहे.
याचे उत्तर खालीलप्रमाणे येते.
-------------------------------------
34
4
Shivaji
Sunday is holiday.
Salary of Patil is Rs.35000 per month
---------------------------------------
या Array चा उपयोग loop पद्धतीमध्ये अधिक सोयीचा ठरतो.
Array म्हणजे एका माळेतील मण्यांप्रमाणे एकाच व्हेरिएबलच्या नावावर अनेक संख्या वा शब्द साठविणे. उदाहरणार्थ
$numbers=array(34,67,4,10,89);
$names[0]="Suresh";
$names[1]="Ashok";
$names[2]="Shivaji";
$names[3]="Neela";
$days=array("Monday", "Tuesday","Wednesday","Sunday");
$salaries["Joshi"] = 20000;
$salaries["Patil"] = 35000;
$salaries["Shah"] = 16000;
ही सारी array ची उदाहरणे आहेत. याचा प्रोग्रॅम खाली दाखविला आहे.
याचे उत्तर खालीलप्रमाणे येते.
-------------------------------------
34
4
Shivaji
Sunday is holiday.
Salary of Patil is Rs.35000 per month
---------------------------------------
या Array चा उपयोग loop पद्धतीमध्ये अधिक सोयीचा ठरतो.
पीएचपी (PHP) भाग-२
पीएचपी प्रोग्रॅमिंगमध्ये if then, for loop हे जावास्क्रिप्टप्रमाणेच आहेत. त्यामुळे त्याची द्विरुक्ती करीत नाही. पूर्वी आपण जावास्क्रिप्ट वापरून पाढे लिहिण्याचा प्रोग्रॅम लिहिला होता. तो एकदा नजरेखालून घाला. आता याचपद्धतीने एकवीसचे पाढे लिहिण्यासाठी केलेला पीएचपी प्रोग्रॅम पहा.
येथे i आणि counter हे दोन व्हेरिएबल वापरून बाहेरच्या लूपमध्ये १ ते १० तर आतल्या लूपमध्ये २१ ते ३० अशा संख्या घातल्या आहेत. टेबलचे सर्व टॅगही echo या कमांडमधून दिले आहेत. स्ताईलमधील कोटेशन चिन्हासाठी \ हे एस्केप चिन्ह घातले आहे. प्रोग्रॅममधील tr व td टॅगच्या लूपमधील जागा नीट समजावून घ्या.
याचे उत्तर खालीलपणे येते.
येथे i आणि counter हे दोन व्हेरिएबल वापरून बाहेरच्या लूपमध्ये १ ते १० तर आतल्या लूपमध्ये २१ ते ३० अशा संख्या घातल्या आहेत. टेबलचे सर्व टॅगही echo या कमांडमधून दिले आहेत. स्ताईलमधील कोटेशन चिन्हासाठी \ हे एस्केप चिन्ह घातले आहे. प्रोग्रॅममधील tr व td टॅगच्या लूपमधील जागा नीट समजावून घ्या.
याचे उत्तर खालीलपणे येते.
पीएचपी (PHP) प्रोगॅमिंग भाग-१
वेबसाईटसाठी पीएचपी (PHP) प्रोगॅमिंग लॅंग्वेजचा वापर कसा केला जातो हे आपण मागच्या धड्यात पाहिले. त्यावेळी आपण फ्क्त पीएचपीच्या साहाय्याने वेबपेजचे भाग एकत्र कसे जोडता येतात हे पाहिले. परंतु पीएचपीविषयी सविस्तर माहिती आपण घेतली नव्हती. पीएचपीचा वापर करून सर्व्हरवरील डाटाबेसच्या साहाय्याने युजरला हवी ती माहिती देण्यासाठी डायनॅमिक वेबसाईट बनविता येते. त्यासाठी पीएचपीची ओळख करून घ्यावयास हवी.
पीएचपी ही मुक्त प्रणाली (Open Source) असून ती सर्व्हरवर स्थापित करावी लागते. सध्या पीएचपी ची 5.2.1 ही आवृत्ती वापरली जाते. पीएचपीमध्ये जावास्क्रिप्टप्रमाणेच व्हेरिएबलचा प्रकार (Integer, string etc) निर्देशित करावा लागत नाही.
पीएचपी कोड हे खाली दाखविल्याप्रमाणे दोन टॅगमध्ये लिहावे लागते. तसेच प्रत्येक ओळीचा शेवट ; या चिन्हाने करावा लागतो. स्क्रीनवर दिसण्यासाठी जावास्क्रिप्टमध्ये जसे document.write वापरतात तसे पीएचपीमध्ये echo ही कमांड वापरावी लागते.
उदाहरणार्थ स्क्रीनवर Hello World हे शब्द उमटण्यासाठी खालील कोड लिहावे लागते.( यातील पॅरेग्राफचा टॅग आवश्यक नाही)
व्हेरिएबल्स -
पीएचपी व्हेरिएबलमध्ये पहिले अक्षर नेहमी $ हे चिन्ह असते. या चिन्हानंतर _ किंवा कोणतेही इंग्रजी अक्षर (a-z,A-Z) असावे लागते. उदाहरणार्थ
$a=57;
$b="Welcome to Dnyandeep"
$_name= "Web Design";
दोन अक्षरसंच एकत्र जोडण्यासाठी + ऎवजी . हे चिन्ह वापरले जाते. जसे
$_name=$_name."Course"; याचा अर्थ $_name=" Web Design Course"; असा होईल.
जावास्क्रिप्टप्रमाणे सर्व गणिती प्रक्रिया पीएचपीमध्ये व्हेरिएबल्स वापरून करता येतात. मात्र त्याचे उत्तर सर्व्हरवरील पीएचपीद्वारे एचटीएमएल पेज स्वरुपात ब्राउजरकडे पाठविले जाते.उदाहरणार्थ खालील प्रोग्रॅम पहा.
येथे $a आणि $b या दोन संख्या घेऊन त्यावर + - * / या गणिती क्रिया केल्या आहेत. प्रत्येक ओळीच्या प्रारंभी माहिती लिहून ती उत्तराला जोडली आहे व प्रत्येक उत्तर स्वतंत्र ओळीवर येण्यासाठी शेवटी br हा टॅग जॊडला आहे.
वरील प्रोग्रॅमचे उत्तर खालीलप्रमाणे येईल.
First Number154
Second Number66
Sum of two numbers 154 and 66 = 220
Difference in two numbers 154 and 66 = 88
Multilication of two numbers 154 and 66 = 10164
Division of two numbers 154 and 66 = 2.3333333333333
पीएचपी ही मुक्त प्रणाली (Open Source) असून ती सर्व्हरवर स्थापित करावी लागते. सध्या पीएचपी ची 5.2.1 ही आवृत्ती वापरली जाते. पीएचपीमध्ये जावास्क्रिप्टप्रमाणेच व्हेरिएबलचा प्रकार (Integer, string etc) निर्देशित करावा लागत नाही.
पीएचपी कोड हे खाली दाखविल्याप्रमाणे दोन टॅगमध्ये लिहावे लागते. तसेच प्रत्येक ओळीचा शेवट ; या चिन्हाने करावा लागतो. स्क्रीनवर दिसण्यासाठी जावास्क्रिप्टमध्ये जसे document.write वापरतात तसे पीएचपीमध्ये echo ही कमांड वापरावी लागते.
उदाहरणार्थ स्क्रीनवर Hello World हे शब्द उमटण्यासाठी खालील कोड लिहावे लागते.( यातील पॅरेग्राफचा टॅग आवश्यक नाही)
व्हेरिएबल्स -
पीएचपी व्हेरिएबलमध्ये पहिले अक्षर नेहमी $ हे चिन्ह असते. या चिन्हानंतर _ किंवा कोणतेही इंग्रजी अक्षर (a-z,A-Z) असावे लागते. उदाहरणार्थ
$a=57;
$b="Welcome to Dnyandeep"
$_name= "Web Design";
दोन अक्षरसंच एकत्र जोडण्यासाठी + ऎवजी . हे चिन्ह वापरले जाते. जसे
$_name=$_name."Course"; याचा अर्थ $_name=" Web Design Course"; असा होईल.
जावास्क्रिप्टप्रमाणे सर्व गणिती प्रक्रिया पीएचपीमध्ये व्हेरिएबल्स वापरून करता येतात. मात्र त्याचे उत्तर सर्व्हरवरील पीएचपीद्वारे एचटीएमएल पेज स्वरुपात ब्राउजरकडे पाठविले जाते.उदाहरणार्थ खालील प्रोग्रॅम पहा.
येथे $a आणि $b या दोन संख्या घेऊन त्यावर + - * / या गणिती क्रिया केल्या आहेत. प्रत्येक ओळीच्या प्रारंभी माहिती लिहून ती उत्तराला जोडली आहे व प्रत्येक उत्तर स्वतंत्र ओळीवर येण्यासाठी शेवटी br हा टॅग जॊडला आहे.
वरील प्रोग्रॅमचे उत्तर खालीलप्रमाणे येईल.
First Number154
Second Number66
Sum of two numbers 154 and 66 = 220
Difference in two numbers 154 and 66 = 88
Multilication of two numbers 154 and 66 = 10164
Division of two numbers 154 and 66 = 2.3333333333333
Sunday, March 6, 2011
पीएचपी वापरून वेबसाईट डिझाईन
वेबसाईट फ्रेम्स या पूर्वीच्या धड्यात आपण फ्रेम्सचा वापर करून वेबसाईट कशाप्रकारे बनविली जायची हे पाहिले. बॅनर, मेनू, तळटीप यासारख्या न बदलणार्या भागांच्या वेगळ्या html फाईल तयार करून फ्रेमद्वारे त्या प्रत्येक पानावरील मजकुराशी जोडल्या जायच्या. मात्र ज्या ब्राउजरला फ्रेम्स दाखविता येत नाहीत त्याच्यासाठी नो फ्रेम्स चा पर्याय ठेवला जायचा. त्यामुळे वेबसाईट योग्यप्रकारे दिसेल याची खात्री देता येत नसे. आता अशा फ्रेम्सच्या ऎवजी ASP, PHP सारख्या प्रोग्रॅमच्या साहाय्याने प्रभावी सुविधा उपलब्ध झाल्याने फ्रेम्सचा वापर फारसा होत नाही.
पीएचपी PHP (PHP Hypertext Preprocessor) ही सर्व्हरवर कार्य करणारी प्रोग्रॅमिंग लॅंग्वेज आहे. स्टॅटिक html वेबपेज ओळखण्यासाठी नावास जोडून .htm किंवा .html लिहिले जाते तर पीएचपी लॅंग्वेज असणार्या वेबपेजच्या नावास .php असा जोड दिलेला असतो. उदाहरणार्थ aboutus.php. पीएचपी प्रोग्रॅम हा html वेबपेजमध्येच या दोन टॅगमध्ये समाविष्ट केला जातो.
डायनॅमिक वेबपेजमध्ये बॅनर, मेनू, बॉटम या विविध भागांची स्वतंत्र वेबपेजेस एकत्र जोडण्यासाठी पीएचपी प्रोग्रॅमचा उपयोग केला जातो. यामुळे contents च्या भागात वेगवेगळी माहिती घालून वेबपेजेस केली जातात. याचा मुख्य फायदा म्हणजे बॅनर,मेनू व बॉटमच्या डिझाईनमध्ये काहीही बदल केले वा मेनू बदलला तरी सर्व वेबपेजेसमध्ये तो बदल आपोआप होतो व प्रत्येक पेज बदलण्याची गरज भासत नाही.
खालील उदाहरणात अशा वेबपेजचा टेबललेस डीआयव्हीवर आधारित लेआउट दिला आहे.
About Us Page
Aboutus Code Page
पीएचपी फाईल समाविष्ट करण्यासाठी योग्य त्या डीआयव्हीमध्ये include (’banner.php’) असे पीएचपी कोड लिहावे लागते.बॅनर, मेनू व बॉटम या भागांसाठी अनुक्रमे banner.php, menu.php आणि bottom.php ही पाने खालीलप्रमाणे करता येतात.
वरील वेबपेजसाठी खालीलप्रमाणे usephp.css सीएसएस वापरली आहे व ती प्रत्येक पानात लिंक केली आहे.
body {
background-color:skyblue;
width:450px;
margin: 0px;
padding: 0px;
}
#banner {
width: 100%;
}
#menu {
background-color:#FFFF66;
float: left;
width: 80px;
height: 250px;
}
#contents {
background-color:skyblue;
float: left;
margin-left:5px;
margin-top:10px;
width: 365px;
height: 240px;
}
#bottom {
background:#999;
color:#000;
clear: both;
width: 100%;
height:25px;
text-align:center;
text-decoration:none
}
h3{
color:#990000;
}
a:link Text{
text-decoration: none;
color:#FFFFFF;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
color:#990000;
}
a:active {
text-decoration: none;
}
याप्रमाणे खालील पेजेस तयार करता येतात.
Activities Page
Contact Page
पीएचपी PHP (PHP Hypertext Preprocessor) ही सर्व्हरवर कार्य करणारी प्रोग्रॅमिंग लॅंग्वेज आहे. स्टॅटिक html वेबपेज ओळखण्यासाठी नावास जोडून .htm किंवा .html लिहिले जाते तर पीएचपी लॅंग्वेज असणार्या वेबपेजच्या नावास .php असा जोड दिलेला असतो. उदाहरणार्थ aboutus.php. पीएचपी प्रोग्रॅम हा html वेबपेजमध्येच
डायनॅमिक वेबपेजमध्ये बॅनर, मेनू, बॉटम या विविध भागांची स्वतंत्र वेबपेजेस एकत्र जोडण्यासाठी पीएचपी प्रोग्रॅमचा उपयोग केला जातो. यामुळे contents च्या भागात वेगवेगळी माहिती घालून वेबपेजेस केली जातात. याचा मुख्य फायदा म्हणजे बॅनर,मेनू व बॉटमच्या डिझाईनमध्ये काहीही बदल केले वा मेनू बदलला तरी सर्व वेबपेजेसमध्ये तो बदल आपोआप होतो व प्रत्येक पेज बदलण्याची गरज भासत नाही.
खालील उदाहरणात अशा वेबपेजचा टेबललेस डीआयव्हीवर आधारित लेआउट दिला आहे.
About Us Page
Aboutus Code Page
पीएचपी फाईल समाविष्ट करण्यासाठी योग्य त्या डीआयव्हीमध्ये include (’banner.php’) असे पीएचपी कोड लिहावे लागते.बॅनर, मेनू व बॉटम या भागांसाठी अनुक्रमे banner.php, menu.php आणि bottom.php ही पाने खालीलप्रमाणे करता येतात.
वरील वेबपेजसाठी खालीलप्रमाणे usephp.css सीएसएस वापरली आहे व ती प्रत्येक पानात लिंक केली आहे.
body {
background-color:skyblue;
width:450px;
margin: 0px;
padding: 0px;
}
#banner {
width: 100%;
}
#menu {
background-color:#FFFF66;
float: left;
width: 80px;
height: 250px;
}
#contents {
background-color:skyblue;
float: left;
margin-left:5px;
margin-top:10px;
width: 365px;
height: 240px;
}
#bottom {
background:#999;
color:#000;
clear: both;
width: 100%;
height:25px;
text-align:center;
text-decoration:none
}
h3{
color:#990000;
}
a:link Text{
text-decoration: none;
color:#FFFFFF;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
color:#990000;
}
a:active {
text-decoration: none;
}
याप्रमाणे खालील पेजेस तयार करता येतात.
Activities Page
Contact Page
Saturday, March 5, 2011
FTP साठी FileZilla (फाईलझिला)चा वापर
वेबसाईट डिझाईन केल्यानंतर ती सर्व्हरवर ठेवावी लागते. यालाच होस्टींग असे म्हणतात. होस्टींग सर्व्हिसेस देणार्या ISP ( इंटरनेट सर्व्हिस प्रोव्हायडर) संस्थेच्या कॉम्प्युटरवर ती ठेवली जाते. अशा दूरस्थ (रिमोट) सर्व्हरकडे वेबसाईटची पेजेस पाठविण्यासाठी फाईल ट्रॅन्स्फर प्रोटोकॉल (FTP) चा वापर करावा लागतो. उदा. ब्राउजरच्या अड्रेसबारमध्ये खालीलप्रमाणे वेबसाईटचा पत्ता लिहावा लागतो.
ftp://www.dnyandeep.net
युजरचे नाव व पासवर्ड घातल्यावर सर्व्हरवरील वेबसाईटचे फोल्डर उघडते. व त्यातल्या फाईल व फोल्डर्स दिसतात.
मग साध्या कॉपी (Copy) व पेस्ट( Paste) टूल्सचा वापर करून आपल्याला फाईल डाउनलोड वा अपलोड करता येतात. मात्र ही सुविधा ब्राउजरच्या प्रकारावर व क्षमतेवर अवलंबून असते. यावर उपाय म्हणून बहुधा सर्व्हरवर फाईल डाउनलोड वा अपलोड करण्यासाठी cpanel ( Control panel) नावाचा विशेष प्रोग्रॅम वापरला जातो. त्यात रिमोट सर्व्हरवरील फाईल्सचे व्यवस्थापन करण्यासाठी अनेक सुविधा असतात.
आपल्याला सर्व्हरवर फाईल पाठविण्यासाठी वा तेथील फाईल आपल्या कॉम्प्युटरवर घेण्यासाठी FileZilla ( फाईलझिला) हा प्रोग्रॅम वापरता येतो.खाली त्याचा मेनू पहा.
याच्या मेनूमध्ये वरच्या पट्टीतील File वा दुसर्या पट्टीतील पहिल्या कॉम्प्युटरच्या चित्रावर क्लिक केले की साईटमेनू मॅनेजरचे पान उघडते.शेजारच्या बाणावर क्लिक केल्यास सर्व वेबसाईट्सची यादी मिळते व त्यावरील विशिष्ट वेबसाईट निवडली की साईट मॅनेजरचे पान उघडते.
यात उजव्या बाजूच्या टेबलमध्ये General (जनरल) टॅबमध्ये होस्ट सर्व्हरचा IP Address (बहुधा वेबसाईटचे नाव), खाली logon मध्ये Normal सिलेक्ट करून युजरचे नाव व FTP पासवर्ड लिहिला की व OK बटनवर क्लिक करावे. तसेच Advanced (अड्व्हान्सड) टॅबमध्ये वेबसाईटचा स्थानिक पता व रिमोट सर्व्हरवरील योग्य फोल्डरचा पत्ता टाईप करावा. आता Connect या बटनावर क्लिक केले की खालच्या दोन रकान्यात डावीकडे स्थानिक फोल्डर तर उजवीकडे रिमोट सर्व्हरवरील वेबसाईटचे फोल्डर उघडते.
आता डावीकडील स्थानिक वेबसाईटच्या फोल्डरंमधील फाईलवर डबलक्लिक केले की ती फाईल रिमोट सर्व्हरवर अपलोड होते. त्याचप्रमाणे उजवीकडील फाईलवर डबलक्लिक केले की ती फाईल स्थानिक फोल्डरमध्ये डाउनलोड होते. मधल्या भागात अपलोड वा डाउनलोडचे कार्य पहाता येते. तर खाली किती फाईलचे काम शिल्लक आहे हे दर्शविले जाते. एकावेळी अनेक फाईल सिलेक्ट करून अपलोड वा डाउनलोड करता येतात.
अशाप्रकारे वेबसाईटच्या सर्व फाईल्स व फोल्डर्स रिमोट सर्व्हरवर अपलोड केले की ब्राउजरमध्ये वेबसाईटचा पत्ता देऊन वेबसाईट पहाता येते.
ftp://www.dnyandeep.net
युजरचे नाव व पासवर्ड घातल्यावर सर्व्हरवरील वेबसाईटचे फोल्डर उघडते. व त्यातल्या फाईल व फोल्डर्स दिसतात.
मग साध्या कॉपी (Copy) व पेस्ट( Paste) टूल्सचा वापर करून आपल्याला फाईल डाउनलोड वा अपलोड करता येतात. मात्र ही सुविधा ब्राउजरच्या प्रकारावर व क्षमतेवर अवलंबून असते. यावर उपाय म्हणून बहुधा सर्व्हरवर फाईल डाउनलोड वा अपलोड करण्यासाठी cpanel ( Control panel) नावाचा विशेष प्रोग्रॅम वापरला जातो. त्यात रिमोट सर्व्हरवरील फाईल्सचे व्यवस्थापन करण्यासाठी अनेक सुविधा असतात.
आपल्याला सर्व्हरवर फाईल पाठविण्यासाठी वा तेथील फाईल आपल्या कॉम्प्युटरवर घेण्यासाठी FileZilla ( फाईलझिला) हा प्रोग्रॅम वापरता येतो.खाली त्याचा मेनू पहा.
याच्या मेनूमध्ये वरच्या पट्टीतील File वा दुसर्या पट्टीतील पहिल्या कॉम्प्युटरच्या चित्रावर क्लिक केले की साईटमेनू मॅनेजरचे पान उघडते.शेजारच्या बाणावर क्लिक केल्यास सर्व वेबसाईट्सची यादी मिळते व त्यावरील विशिष्ट वेबसाईट निवडली की साईट मॅनेजरचे पान उघडते.
यात उजव्या बाजूच्या टेबलमध्ये General (जनरल) टॅबमध्ये होस्ट सर्व्हरचा IP Address (बहुधा वेबसाईटचे नाव), खाली logon मध्ये Normal सिलेक्ट करून युजरचे नाव व FTP पासवर्ड लिहिला की व OK बटनवर क्लिक करावे. तसेच Advanced (अड्व्हान्सड) टॅबमध्ये वेबसाईटचा स्थानिक पता व रिमोट सर्व्हरवरील योग्य फोल्डरचा पत्ता टाईप करावा. आता Connect या बटनावर क्लिक केले की खालच्या दोन रकान्यात डावीकडे स्थानिक फोल्डर तर उजवीकडे रिमोट सर्व्हरवरील वेबसाईटचे फोल्डर उघडते.
आता डावीकडील स्थानिक वेबसाईटच्या फोल्डरंमधील फाईलवर डबलक्लिक केले की ती फाईल रिमोट सर्व्हरवर अपलोड होते. त्याचप्रमाणे उजवीकडील फाईलवर डबलक्लिक केले की ती फाईल स्थानिक फोल्डरमध्ये डाउनलोड होते. मधल्या भागात अपलोड वा डाउनलोडचे कार्य पहाता येते. तर खाली किती फाईलचे काम शिल्लक आहे हे दर्शविले जाते. एकावेळी अनेक फाईल सिलेक्ट करून अपलोड वा डाउनलोड करता येतात.
अशाप्रकारे वेबसाईटच्या सर्व फाईल्स व फोल्डर्स रिमोट सर्व्हरवर अपलोड केले की ब्राउजरमध्ये वेबसाईटचा पत्ता देऊन वेबसाईट पहाता येते.
Friday, March 4, 2011
ड्रीमव्हीवरच्या साहाय्याने वेबपेज डिझाईन. भाग - ३
वेबपेजमध्ये टेबल घालायचे असल्यास वरच्या पट्टीतील इन्सर्ट सुविधा वापरून ते घालता येते. टेबलची रुंदी, उंची, किती ओळी (tr) व कितॊ रकाने (td),पॅडींग इत्यादी सर्व माहिती टेबल सिलेक्ट करून येणार्या टेबलच्या प्रॉपर्टीज विंडोमध्ये भरता येतात. मेन डिझाईन विंडो व खालील प्रॉपर्टी विंडो यांच्या मधल्या पट्टीत सिलेक्ट केलेला टॅग दिसतो. त्यावर क्लिक करून देखील हवी ती प्रॉपर्टी विंडो उघडता येते.
त्याच प्रमाणे टेबलमध्ये मजकूर लिहिता येतो. याचे कोड (html program ) आपोआप तयार होतो. खालील उदाहरण पहा.
याच पद्धतीने सर्व आवश्यक घटक घालून ड्रीमव्हीवरच्या साहाय्याने वेबपेज डिझाईन करता येते. ते ब्राउजरमध्ये टेस्ट करून बघता येते.
ड्रीमव्हीवरच्या साईट व्यवस्थापन सुविधेचा उपयोग करून वेबसाईट सर्व्हरवर अपलोद करणे वा त्यात बदल करणे वा सर्व्हरवरील वेबपेजेस डाउनलोड करणे इत्यादी गोष्टी करता येतात.
ड्रीमव्हीवरमध्ये सीएसएस स्टाईलशीट ही तयार करता येतो व तो वेबपेजला जोडता येतो. (Apply Stylesheet)
एकंदरित पाहता ड्रीमव्हीवरच्या वापराने वेबडिझाईनचे काम सोपे होते.
त्याच प्रमाणे टेबलमध्ये मजकूर लिहिता येतो. याचे कोड (html program ) आपोआप तयार होतो. खालील उदाहरण पहा.
याच पद्धतीने सर्व आवश्यक घटक घालून ड्रीमव्हीवरच्या साहाय्याने वेबपेज डिझाईन करता येते. ते ब्राउजरमध्ये टेस्ट करून बघता येते.
ड्रीमव्हीवरच्या साईट व्यवस्थापन सुविधेचा उपयोग करून वेबसाईट सर्व्हरवर अपलोद करणे वा त्यात बदल करणे वा सर्व्हरवरील वेबपेजेस डाउनलोड करणे इत्यादी गोष्टी करता येतात.
ड्रीमव्हीवरमध्ये सीएसएस स्टाईलशीट ही तयार करता येतो व तो वेबपेजला जोडता येतो. (Apply Stylesheet)
एकंदरित पाहता ड्रीमव्हीवरच्या वापराने वेबडिझाईनचे काम सोपे होते.
ड्रीमव्हीवरच्या साहाय्याने वेबपेज डिझाईन. भाग - २
ड्रीमव्हीवरच्या डिझाईनचे मुख्य पान
येथे वरच्या पट्टीत फाईल(File), एडीट(Edit),व्ह्यू(View), इन्सर्ट(Insert), मॉडीफाय(Modify), टेक्स्ट(Text),कमांड्स(Commands), साईट(Site0, सोथिंक(Sothink), विंडो(Window) व हेल्प(Help) असे मेनू आहेत.
दुसर्या पट्टीत वेबपेजमध्ये लिंक, मेल, अँकर, टेबल, चित्र यासारख्या नेहमी लागणार्या गोष्टी ट्लबारच्या स्वरुपात मांडल्या आहेत. मुख्य स्टेजसाठी कोड, स्प्लिट(कोड व डिझाईन) व डिझाईन असे तीन पर्याय आहेत. यातील डिझाईन विभाग उघडून त्यात आपण माहिती लिहिली की त्याचे गुणविशेष खालच्या प्रॉपर्टीजमध्ये बदलता येतात.
वरील उदाहरणात Dnyandeep Foundation असे लिहून त्याला हेडिंगचा टॅग लावला आहे. त्याच्या खाली वरच्या पट्टीतील इन्सर्ट सुविधा वापरून ज्ञानदीपच्या लोगोचे चित्र घातले आहे. यासाठी कोणताही प्रोग्रॅम लिहावा लागला नाही.उलट असा प्रोग्रॅम आपोआप ड्रीमव्हीवरने तयार केला आहे तो खालील चित्रात पहा.
टेक्स्ट प्रॉपर्टीज
आता Dnyandeep Foundation असे लिहून ते माउसने सिलेक्ट केले की प्रॉपर्टीज विंडोमध्ये खालील टेक्स्ट प्रॉपर्टीजचे पर्याय येतात.
इमेज प्रॉपर्टीज
तसेच ज्ञानदीपच्या लोगोचे चित्र इन्सर्ट करून ते सिलेक्ट केले की प्रॉपर्टीज विंडोमध्ये खालील इमेज प्रॉपर्टीजचे पर्याय येतात.
वरिल पर्यायात बदल करणे अगदी सोपे असते. त्याप्रमाणे कोडमध्येही बदल होतो.
येथे वरच्या पट्टीत फाईल(File), एडीट(Edit),व्ह्यू(View), इन्सर्ट(Insert), मॉडीफाय(Modify), टेक्स्ट(Text),कमांड्स(Commands), साईट(Site0, सोथिंक(Sothink), विंडो(Window) व हेल्प(Help) असे मेनू आहेत.
दुसर्या पट्टीत वेबपेजमध्ये लिंक, मेल, अँकर, टेबल, चित्र यासारख्या नेहमी लागणार्या गोष्टी ट्लबारच्या स्वरुपात मांडल्या आहेत. मुख्य स्टेजसाठी कोड, स्प्लिट(कोड व डिझाईन) व डिझाईन असे तीन पर्याय आहेत. यातील डिझाईन विभाग उघडून त्यात आपण माहिती लिहिली की त्याचे गुणविशेष खालच्या प्रॉपर्टीजमध्ये बदलता येतात.
वरील उदाहरणात Dnyandeep Foundation असे लिहून त्याला हेडिंगचा टॅग लावला आहे. त्याच्या खाली वरच्या पट्टीतील इन्सर्ट सुविधा वापरून ज्ञानदीपच्या लोगोचे चित्र घातले आहे. यासाठी कोणताही प्रोग्रॅम लिहावा लागला नाही.उलट असा प्रोग्रॅम आपोआप ड्रीमव्हीवरने तयार केला आहे तो खालील चित्रात पहा.
टेक्स्ट प्रॉपर्टीज
आता Dnyandeep Foundation असे लिहून ते माउसने सिलेक्ट केले की प्रॉपर्टीज विंडोमध्ये खालील टेक्स्ट प्रॉपर्टीजचे पर्याय येतात.
इमेज प्रॉपर्टीज
तसेच ज्ञानदीपच्या लोगोचे चित्र इन्सर्ट करून ते सिलेक्ट केले की प्रॉपर्टीज विंडोमध्ये खालील इमेज प्रॉपर्टीजचे पर्याय येतात.
वरिल पर्यायात बदल करणे अगदी सोपे असते. त्याप्रमाणे कोडमध्येही बदल होतो.
ड्रीमव्हीवरच्या साहाय्याने वेबपेज डिझाईन. भाग - १
साध्या नोटपॅडच्या साहाय्याने एचटीएमएल टॅग वापरून वेबपेज कसे तयार करता येते हे आपण पाहिले. असे वेबपेज करताना एचटीएमएल टॅगची पूर्ण माहिती असणे आवश्यक असते. मात्र वेबपेज डिझाईनसाठी ड्रीमव्हीवर किंवा फ्रंटपेजसारख्या सुविधांचा वापर केल्यास कोणतेही हार्ड कोडींग न करता केवळ डिझाईन टूल्सचा वापर करून वेब पेज तयार करता येते. व्यावसायिक वेब डिझाय़नर सहसा अशा सुविधेचा वापर करतात. त्यात त्यांचा बराचसा वेळ वाचतो. तुम्ही म्हणाल मग एचटीएमएल टॅग वापरून वेबपेज कसे तयार करता येते हे शिकण्याची गरजच काय?
येथे ही गोष्ट लक्षात ठेवणे जरूर आहे की एचटीएमएल टॅगची पूर्ण माहिती असेल तर ड्रीमव्हीवरसारख्या सुविधा वापरताना त्यावर पूर्ण अवलंबून रहावे लागत नाही व एचटीएमएल कोडमध्ये बदल करून डिझाईनमधील राहिलेल्या उणिवा वा चुका त्वरित दुरुस्त करता येतात. एकदा वेबपेज डिझाईन सुविधा वापरण्याची सवय लागली की एचटीएमएल टॅग शिकण्यात उत्साह रहात नाही यासाठी वेबपेज डिझाईनचे शिक्षण देताना प्रथम एचटीएमएल टॅग वापरून वेबपेज कसे तयार करावयाचे हे शिकविले जाते.
फ्रंटपेज ही मायक्रोसॉफ्ट कंपनीने विकसित केलेली वेबडिझाईन सुविधा असून ती एम एस ऑफिसमध्ये अंतर्भूत असते. ड्रीमव्हीवर ही अडोब ( पूर्वी मॅक्रोमिडियाचे) कंपनीने विकसित केलेली वेबडिझाईन सुविधा असून अडोबच्या संकेतस्थळावरून मिळविता येते.
मॅक्रोमिडिया ड्रीमव्हीवर ८ चा स्क्रीन खाली दाखविला आहे.
यात तीन रकाने आहेत. पहिल्या रकान्यात पूर्वीच्या फाइल्सची यादी असून त्यातून कोणतीही फाईल उघडता येते. मधल्या रकान्यात कोणकोणत्या प्रकारच्या वेबपेज फाईलसाठी ही सुविधा वापरता येते याची यादी असून त्यातील योग्य तो प्रकार निवडता येतो. यात साधे एचटीएमएल पेज, एएसपी, पीएचपी, सीएसएस सारखे पर्याय आहेत.तिसर्या रकान्यात वेबपेजच्या तयार नमुन्यांचा उपयोग करून वेबपेज करण्यासाठी पर्याय दिले आहेत.
खालच्या पट्टीत ड्रीमव्हीवर नवीन वापरणार्यांसाठी ट्यूटोरियल व ड्रीमव्हीवरविषयी अधिक माहिती पाहण्याची सोय आहे.
आपण मधल्या रकान्यातून नवे एचटीएमएल पेजचा पर्याय निवडला की खालील प्रकारचे पान उघडते.
आपण बेसिक पेज एचटीएमएल हा पर्याय निवडला की ड्रीमव्हीवरच्या डिझाईनचे मुख्य पान उघडते.
येथे ही गोष्ट लक्षात ठेवणे जरूर आहे की एचटीएमएल टॅगची पूर्ण माहिती असेल तर ड्रीमव्हीवरसारख्या सुविधा वापरताना त्यावर पूर्ण अवलंबून रहावे लागत नाही व एचटीएमएल कोडमध्ये बदल करून डिझाईनमधील राहिलेल्या उणिवा वा चुका त्वरित दुरुस्त करता येतात. एकदा वेबपेज डिझाईन सुविधा वापरण्याची सवय लागली की एचटीएमएल टॅग शिकण्यात उत्साह रहात नाही यासाठी वेबपेज डिझाईनचे शिक्षण देताना प्रथम एचटीएमएल टॅग वापरून वेबपेज कसे तयार करावयाचे हे शिकविले जाते.
फ्रंटपेज ही मायक्रोसॉफ्ट कंपनीने विकसित केलेली वेबडिझाईन सुविधा असून ती एम एस ऑफिसमध्ये अंतर्भूत असते. ड्रीमव्हीवर ही अडोब ( पूर्वी मॅक्रोमिडियाचे) कंपनीने विकसित केलेली वेबडिझाईन सुविधा असून अडोबच्या संकेतस्थळावरून मिळविता येते.
मॅक्रोमिडिया ड्रीमव्हीवर ८ चा स्क्रीन खाली दाखविला आहे.
यात तीन रकाने आहेत. पहिल्या रकान्यात पूर्वीच्या फाइल्सची यादी असून त्यातून कोणतीही फाईल उघडता येते. मधल्या रकान्यात कोणकोणत्या प्रकारच्या वेबपेज फाईलसाठी ही सुविधा वापरता येते याची यादी असून त्यातील योग्य तो प्रकार निवडता येतो. यात साधे एचटीएमएल पेज, एएसपी, पीएचपी, सीएसएस सारखे पर्याय आहेत.तिसर्या रकान्यात वेबपेजच्या तयार नमुन्यांचा उपयोग करून वेबपेज करण्यासाठी पर्याय दिले आहेत.
खालच्या पट्टीत ड्रीमव्हीवर नवीन वापरणार्यांसाठी ट्यूटोरियल व ड्रीमव्हीवरविषयी अधिक माहिती पाहण्याची सोय आहे.
आपण मधल्या रकान्यातून नवे एचटीएमएल पेजचा पर्याय निवडला की खालील प्रकारचे पान उघडते.
आपण बेसिक पेज एचटीएमएल हा पर्याय निवडला की ड्रीमव्हीवरच्या डिझाईनचे मुख्य पान उघडते.
Subscribe to:
Posts (Atom)