Well - for my own benefit I am creating a Drupal blog. I know this has very little to do with spirituality but it serves as a reminder of the progressive steps to achieve a Content Management System(CMS) run website.
This particular venture is actually converting an already existent website (www.ctiscarborough.org.uk) into a website which can be managed independently of the designer. I have decided not to use a given theme but to start from scratch.
So here goes ......
STEP 1: Download Wampserver so I have a local server. Follow instructions and it all sets up easily.
STEP 2: Download a version of Drupal. I have decided to download from Acquia (http://acquia.com/downloads) as this is run by the founder of Drupal and also I understand it has 'waytogo' provisions and grouped modules which I have not fully grasped but will serve me in the months ahead!
STEP 3: Unzip the Drupal Core into the www folder of the Wampserver folder (C Drive)
STEP 4: Click the wampserver icon PHPmyAdmin and create a 'drupal' database.
STEP 5: Click the localhost DRupal site appears and follow through instructions..
STEP 6: Clean URL's ... if this does not show as an option. Check the Apache httpd.conf file and un-comment: "LoadModule rewrite_module modules/mod_rewrite.so"
STEP 7: In the folder: www/sites/all/ create a folder called 'themes'.
STEP 8: In the folder 'themes' create a folder called (in this case) ctis. Your folder would be the name of your site so if I use ctis in future replace it with the name of your site.
STEP 9: Create an .info file ... copy the contents of the 'garland' info and exchange the word 'Garland' for 'ctis' save in the ctis folder.
STEP 10: Take the index.html and copy it into ctis file and change it to 'page.tpl.php'
STEP 11: copy also into the ctis the css file but change that to 'style.css'
STEP 12: Open up localhost on browser by clicking the white semi circle in the bottom right of screne ... check in 'themes' and locate 'ctis' and make it the default theme ... save. Now the index page of your original site appears as localhost in Drupal via the local server you have set up through wamp.
++++++++++This is where the fun begins +++++++++++++++
STEP 13: Create more pages... the about , events etc: Admin>Create Content>Page . Note Menu Link Title = same as you want the nav tab to look like. Title = What will appear on the top of the page. Primary link has been chosen as this will fit with Drupals default placing of a top horizontal navigation menu. What a joyful surprise it was to me that the default Drupal html for this navigation structure is an unordered list(ul). Therefore since I placed the primary navigation Drupal variable within the divs for my original navigation the css picked up the same code ... lo and behold the tabs appeared as the original straight away! Before putting content into the page make sure Input Options = Full html. Then copy and paste the full html from the original page into the body section.
Step 14 From then onwards it is a case of puuting your html into each relevant page and checking to see what it looks like. If any CSS needed is from other style sheets slip it into the styles (Drupal default). I use Firefox addon Firebug which can help you locate any styling problems by locating which style refers to which item in the original and making sure it is being applied to the new Drupal version of the website.
Step 15 Images .... of course jpegs and gifs etc were probably in an 'images' file in the original website. Unless these are placed in the correct file they will not show on the new Drupal site. You can upload these by enabling the optional core module 'Upload' which will then show up in the 'file attachments' section underneath the body section where code and content is placed. I have found that this is unnecesary because you can do this manually by simply finding the file it uploads to which is the sites/default/files folder in my case. However there is the option to allow the users browser to download the file if the module upload is enabled above which the path of the pic is indicated to help you locate for manual linking. So it is simply a matter wherever you have a link of say img src="images/ pic.jpg" to change it to img src="/sites/default/files/pic.jpg" (not forgetting the first forward slash) provided you have placed or the image uploader has placed the image in /sites/default/files.
Step 16 SPRY ... well SPRY is another form of AJAX. I used it to create this page. Drupal uses jQuery which is similar. I struggled and went round the houses thinking that I had some imagined problem of Drupal not being compatable with Spry and no-one as yet having created a module for it. THIS IS NOT THE CASE. It is again a simple case of copy and pasting all the javascript and html into the Drupal page content and making sure all links have been corrected and files uploaded. XML files go in (my case) the upload target of sites/default. In my case links to images within the XML file had to be changed. All .js files refering to the Spry framework (eg xpath.js / SpryEffects.js / SpryAccordian.js etc) used in the original html have to be placed in the /sites/default/files. In my case all my Spry was created through Dreamweaver CS3 so .js files are bundled together in the 'SpryAssets' folder. By dragging the whole folder into the default file the link would be /sites/default/files/SpryAssets. IF YOU HAVE PATIENTLY ADJUSTED RELEVANT LINKS AND MOVED THE RELEVANT FILE ALL SHOULD BE WELL BUT 2 MORE THINGS:
1) Using Dreamweaver Spry uses different css files for its design ... these have to be copy and pasted into styles.css for the correct formatting to take place.
2) ... It is important to enable the PHP module and enable the input format under site configuration to allow for PHP. Tags used in AJAX/ SPRY are such that the enabling of the PHP module will allow their usage.
Step 15 Images .... of course jpegs and gifs etc were probably in an 'images' file in the original website. Unless these are placed in the correct file they will not show on the new Drupal site. You can upload these by enabling the optional core module 'Upload' which will then show up in the 'file attachments' section underneath the body section where code and content is placed. I have found that this is unnecesary because you can do this manually by simply finding the file it uploads to which is the sites/default/files folder in my case. However there is the option to allow the users browser to download the file if the module upload is enabled above which the path of the pic is indicated to help you locate for manual linking. So it is simply a matter wherever you have a link of say img src="images/ pic.jpg" to change it to img src="/sites/default/files/pic.jpg" (not forgetting the first forward slash) provided you have placed or the image uploader has placed the image in /sites/default/files.
Step 16 SPRY ... well SPRY is another form of AJAX. I used it to create this page. Drupal uses jQuery which is similar. I struggled and went round the houses thinking that I had some imagined problem of Drupal not being compatable with Spry and no-one as yet having created a module for it. THIS IS NOT THE CASE. It is again a simple case of copy and pasting all the javascript and html into the Drupal page content and making sure all links have been corrected and files uploaded. XML files go in (my case) the upload target of sites/default. In my case links to images within the XML file had to be changed. All .js files refering to the Spry framework (eg xpath.js / SpryEffects.js / SpryAccordian.js etc) used in the original html have to be placed in the /sites/default/files. In my case all my Spry was created through Dreamweaver CS3 so .js files are bundled together in the 'SpryAssets' folder. By dragging the whole folder into the default file the link would be /sites/default/files/SpryAssets. IF YOU HAVE PATIENTLY ADJUSTED RELEVANT LINKS AND MOVED THE RELEVANT FILE ALL SHOULD BE WELL BUT 2 MORE THINGS:
1) Using Dreamweaver Spry uses different css files for its design ... these have to be copy and pasted into styles.css for the correct formatting to take place.
2) ... It is important to enable the PHP module and enable the input format under site configuration to allow for PHP. Tags used in AJAX/ SPRY are such that the enabling of the PHP module will allow their usage.
Posts
No comments:
Post a Comment