slice photoshop template for website

Please support our Graphics and Multimedia advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases
Reply

•
•
Join Date: Dec 2004
Posts: 27
Reputation: faisyshah is an unknown quantity at this point 
Solved Threads: 0
faisyshah faisyshah is offline Offline
Light Poster

slice photoshop template for website

 
0
  #1
Sep 7th, 2005
Assalam alaikum

i have a template in photoshop i want to use this template for my website problem is that how i can cut or slice template in the form of images. if your answer is adobe photoshop , firework or image ready then please describe in detail how i can cut template.

Thanks in advance
Reply With Quote Quick reply to this message  
•
•
Join Date: Jul 2005
Posts: 69
Reputation: bkendall is an unknown quantity at this point 
Solved Threads: 0
bkendall's Avatar
bkendall bkendall is offline Offline
Junior Poster in Training

Re: slice photoshop template for website

 
0
  #2
Sep 8th, 2005
You can use photoshop, imageready or fireworks to slice images. depending on the version of photoshop that you have, there is a slice icon in the main toolbar and there is two option one for slicing and the other for editing a slice.

You simply draw boxes around the sections of the images to create your slices. It will probably take some practice to get the slices the way you want them but you can also use the edit slice tool to clean them up. once you get the image sliced the way you want it, choose export for the web (assuming you are using a recent version of photoshop) you will need to cutomize the output options to make sure you are exporting the slices the way you want and then just add them to an html page.

The best advice I can give you is to locate the slice tool and play with it. the best way I have found to learn new features in software is to explore and play. Let us know how you make out.
Reply With Quote Quick reply to this message  
•
•
Join Date: Dec 2004
Posts: 27
Reputation: faisyshah is an unknown quantity at this point 
Solved Threads: 0
faisyshah faisyshah is offline Offline
Light Poster

Re: slice photoshop template for website

 
0
  #3
Sep 9th, 2005
very very thanks

i have completed my task

thanks again bkendall
Reply With Quote Quick reply to this message  
•
•
Join Date: Oct 2008
Posts: 3
Reputation: alfator is an unknown quantity at this point 
Solved Threads: 0
alfator alfator is offline Offline
Newbie Poster

Re: slice photoshop template for website

 
0
  #4
Oct 30th, 2008
thank you for help aswell. now i have just little problem : when i export and save it and then load it in Adobe Dreamweaver latest version and want to insert link into an image button that i sliced it doesnt show any errors in dream* but when i upload to website ftp and try to use the button "click " around the sliced image that ive done link POP'S out a blue line around the image . How can i prevent that from happening !?

and help would be much apricated
Last edited by alfator; Oct 30th, 2008 at 8:18 pm.
Reply With Quote Quick reply to this message  
•
•
Join Date: Dec 2004
Posts: 4,275
Reputation: peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of 
Solved Threads: 494
Moderator
Featured Poster
peter_budo's Avatar
peter_budo peter_budo is offline Offline
Code tags enforcer

Re: slice photoshop template for website

 
-1
  #5
Oct 31st, 2008
•
•
•
•
Originally Posted by alfator View Post
thank you for help aswell. now i have just little problem : when i export and save it and then load it in Adobe Dreamweaver latest version and want to insert link into an image button that i sliced it doesnt show any errors in dream* but when i upload to website ftp and try to use the button "click " around the sliced image that ive done link POP'S out a blue line around the image . How can i prevent that from happening !?

and help would be much apricated
Please post the code of the relevant section.
Learn to see in another's calamity the ills which you should avoid.
Publilius Syrus
(~100 BC)
LJC - London Java Community, Graduate & Undergraduate Software Development Community, JAVAWUG (Java Web User Group), The London Android Group
Reply With Quote Quick reply to this message  
•
•
Join Date: Oct 2008
Posts: 3
Reputation: alfator is an unknown quantity at this point 
Solved Threads: 0
alfator alfator is offline Offline
Newbie Poster

Re: slice photoshop template for website

 
0
  #6
Oct 31st, 2008
Right don't worry about slicing Ive figured that part out already

now i have another question :

here is what turned out from what ive sliced up from photoshop and uploaded to my ftp

Im looking for some tutorials how to make this page flash ( flash website )

www.alfator.com/index3.html

the links like About / Gallery / Community/ Vip / and Conact will be looking to be done in the same whay as ive done Home page .

Im new to flash ( dummy )

Huge thank you in advance

Also here is a code of Below website link ive posted:
Graphics and Multimedia Syntax (Toggle Plain Text) 
  1. <html> 
  2. <head> 
  3. <title>Alfator Remake</title> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> 
  5. <style type="text/css"> 
  6. <!--
  7. body {
  8. 	background-image: url(../../333.jpg);
  9. }
  10. --> 
  11. </style></head> 
  12. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> 
  13. <center> 
  14.   <!-- ImageReady Slices (layout2.psd) --> 
  15.   <table id="Table_01" width="1200" height="828" border="0" cellpadding="0" cellspacing="0"> 
  16.     <tr> 
  17.       <td rowspan="7"> 
  18.         <img src="images/layout2_01.jpg" width="111" height="828" alt=""></td> 
  19. 	    <td colspan="7"> 
  20. 		    <img src="images/layout2_02.jpg" width="937" height="118" alt=""></td> 
  21. 	    <td rowspan="7"> 
  22. 		    <img src="images/layout2_03.jpg" width="152" height="828" alt=""></td> 
  23. 	  </tr> 
  24.     <tr> 
  25.       <td rowspan="2"> 
  26.         <a href="http://alfator.com"> 
  27.           <img src="images/layout2_04.jpg" width="370" height="98" border="0" alt=""></a></td> 
  28. 	    <td> 
  29. 		    <a href="http://alfator.com/about.html"> 
  30. 		      <img src="images/layout2_05.jpg" width="95" height="43" border="0" alt=""></a></td> 
  31. 	    <td> 
  32. 		    <img src="images/layout2_06.jpg" width="1" height="43" alt=""></td> 
  33. 	    <td> 
  34. 		    <a href="http://www.alfator.com/vip/gallery/main.php"> 
  35. 		      <img src="images/layout2_07.jpg" width="97" height="43" border="0" alt=""></a></td> 
  36. 	    <td> 
  37. 		    <a href="http://alfator.com/forums/index.php"> 
  38. 		      <img src="images/layout2_08.jpg" width="143" height="43" border="0" alt=""></a></td> 
  39. 	    <td> 
  40. 		    <a href="http://alfator.com/forums/forum14.html"> 
  41. 		      <img src="images/layout2_09.jpg" width="140" height="43" border="0" alt=""></a></td> 
  42. 	    <td> 
  43. 		    <img src="images/layout2_10.jpg" width="91" height="43" alt=""></td> 
  44. 	  </tr> 
  45.     <tr> 
  46.       <td colspan="6"> 
  47.         <img src="images/layout2_11.jpg" width="567" height="55" alt=""></td> 
  48. 	  </tr> 
  49.     <tr> 
  50.       <td colspan="7"> 
  51.         <img src="images/layout2_12.jpg" width="937" height="271" alt=""></td> 
  52. 	  </tr> 
  53.     <tr> 
  54.       <td colspan="7"> 
  55.         <img src="images/layout2_13.jpg" width="937" height="271" alt=""></td> 
  56. 	  </tr> 
  57.     <tr> 
  58.       <td colspan="7"> 
  59.         <img src="images/layout2_14.jpg" width="937" height="31" alt=""></td> 
  60. 	  </tr> 
  61.     <tr> 
  62.       <td colspan="7"> 
  63.         <img src="images/layout2_15.jpg" width="937" height="39" alt=""></td> 
  64. 	  </tr> 
  65.   </table> 
  66.   <!-- End ImageReady Slices --> 
  67. </center> 
  68. </body> 
  69. </html><!-- text below generated by server. PLEASE REMOVE --><!-- Counter/Statistics data collection code --><script language="JavaScript" src="http://us.js2.yimg.com/us.js.yimg.com/lib/smb/js/hosting/cp/js_source/whv2_001.js"></script><script language="javascript">geovisit();</script><noscript><img src="http://visit.webhosting.yahoo.com/visit.gif?us1225493994" alt="setstats" border="0" width="1" height="1"></noscript>
Last edited by alfator; Oct 31st, 2008 at 8:03 pm.
Reply With Quote Quick reply to this message  
•
•
Join Date: Dec 2004
Posts: 4,275
Reputation: peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of peter_budo has much to be proud of 
Solved Threads: 494
Moderator
Featured Poster
peter_budo's Avatar
peter_budo peter_budo is offline Offline
Code tags enforcer

Re: slice photoshop template for website

 
-1
  #7
Nov 1st, 2008
Flash tutorial basics from w3schools.com, Adobe official tutorials on Flash or perhaps their Designer community.
I would suggest to start with w3schools basic tutorials to get to know the Flash environment and then search for topics of your interest. Over there years Flash accumulated huge numbers of website specifically targeting Flash
Learn to see in another's calamity the ills which you should avoid.
Publilius Syrus
(~100 BC)
LJC - London Java Community, Graduate & Undergraduate Software Development Community, JAVAWUG (Java Web User Group), The London Android Group
Reply With Quote Quick reply to this message  
•
•
Join Date: Oct 2008
Posts: 3
Reputation: alfator is an unknown quantity at this point 
Solved Threads: 0
alfator alfator is offline Offline
Newbie Poster

Re: slice photoshop template for website

 
0
  #8
Nov 1st, 2008
thank you so much!
Reply With Quote Quick reply to this message  
•
•
Join Date: Jul 2007
Posts: 91
Reputation: Reliable is an unknown quantity at this point 
Solved Threads: 2
Reliable Reliable is offline Offline
Junior Poster in Training

Re: slice photoshop template for website

 
0
  #9
Nov 3rd, 2008
I would use CSS to eliminate the blue line around the images. The code is short and sweet

Graphics and Multimedia Syntax (Toggle Plain Text) 
  1. img
  2. {  border-style: none;
  3. }
Reply With Quote Quick reply to this message  
•
•
Join Date: Nov 2008
Posts: 22
Reputation: Wrams is an unknown quantity at this point 
Solved Threads: 0
Wrams's Avatar
Wrams Wrams is offline Offline
Newbie Poster

Re: slice photoshop template for website

 
0
  #10
Jun 29th, 2009
•
•
•
•
Originally Posted by alfator View Post
Right don't worry about slicing Ive figured that part out already

now i have another question :

here is what turned out from what ive sliced up from photoshop and uploaded to my ftp

Im looking for some tutorials how to make this page flash ( flash website )

www.alfator.com/index3.html

the links like About / Gallery / Community/ Vip / and Conact will be looking to be done in the same whay as ive done Home page .

Im new to flash ( dummy )

Huge thank you in advance

Also here is a code of Below website link ive posted:
Graphics and Multimedia Syntax (Toggle Plain Text) 
  1. <html> 
  2. <head> 
  3. <title>Alfator Remake</title> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> 
  5. <style type="text/css"> 
  6. <!--
  7. body {
  8. 	background-image: url(../../333.jpg);
  9. }
  10. --> 
  11. </style></head> 
  12. <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> 
  13. <center> 
  14.   <!-- ImageReady Slices (layout2.psd) --> 
  15.   <table id="Table_01" width="1200" height="828" border="0" cellpadding="0" cellspacing="0"> 
  16.     <tr> 
  17.       <td rowspan="7"> 
  18.         <img src="images/layout2_01.jpg" width="111" height="828" alt=""></td> 
  19. 	    <td colspan="7"> 
  20. 		    <img src="images/layout2_02.jpg" width="937" height="118" alt=""></td> 
  21. 	    <td rowspan="7"> 
  22. 		    <img src="images/layout2_03.jpg" width="152" height="828" alt=""></td> 
  23. 	  </tr> 
  24.     <tr> 
  25.       <td rowspan="2"> 
  26.         <a href="http://alfator.com"> 
  27.           <img src="images/layout2_04.jpg" width="370" height="98" border="0" alt=""></a></td> 
  28. 	    <td> 
  29. 		    <a href="http://alfator.com/about.html"> 
  30. 		      <img src="images/layout2_05.jpg" width="95" height="43" border="0" alt=""></a></td> 
  31. 	    <td> 
  32. 		    <img src="images/layout2_06.jpg" width="1" height="43" alt=""></td> 
  33. 	    <td> 
  34. 		    <a href="http://www.alfator.com/vip/gallery/main.php"> 
  35. 		      <img src="images/layout2_07.jpg" width="97" height="43" border="0" alt=""></a></td> 
  36. 	    <td> 
  37. 		    <a href="http://alfator.com/forums/index.php"> 
  38. 		      <img src="images/layout2_08.jpg" width="143" height="43" border="0" alt=""></a></td> 
  39. 	    <td> 
  40. 		    <a href="http://alfator.com/forums/forum14.html"> 
  41. 		      <img src="images/layout2_09.jpg" width="140" height="43" border="0" alt=""></a></td> 
  42. 	    <td> 
  43. 		    <img src="images/layout2_10.jpg" width="91" height="43" alt=""></td> 
  44. 	  </tr> 
  45.     <tr> 
  46.       <td colspan="6"> 
  47.         <img src="images/layout2_11.jpg" width="567" height="55" alt=""></td> 
  48. 	  </tr> 
  49.     <tr> 
  50.       <td colspan="7"> 
  51.         <img src="images/layout2_12.jpg" width="937" height="271" alt=""></td> 
  52. 	  </tr> 
  53.     <tr> 
  54.       <td colspan="7"> 
  55.         <img src="images/layout2_13.jpg" width="937" height="271" alt=""></td> 
  56. 	  </tr> 
  57.     <tr> 
  58.       <td colspan="7"> 
  59.         <img src="images/layout2_14.jpg" width="937" height="31" alt=""></td> 
  60. 	  </tr> 
  61.     <tr> 
  62.       <td colspan="7"> 
  63.         <img src="images/layout2_15.jpg" width="937" height="39" alt=""></td> 
  64. 	  </tr> 
  65.   </table> 
  66.   <!-- End ImageReady Slices --> 
  67. </center> 
  68. </body> 
  69. </html><!-- text below generated by server. PLEASE REMOVE --><!-- Counter/Statistics data collection code --><script language="JavaScript" src="http://us.js2.yimg.com/us.js.yimg.com/lib/smb/js/hosting/cp/js_source/whv2_001.js"></script><script language="javascript">geovisit();</script><noscript><img src="http://visit.webhosting.yahoo.com/visit.gif?us1225493994" alt="setstats" border="0" width="1" height="1"></noscript>

Wow, that is the "Worst" coding i have seen in a long long time. Wheres your Semantics what are you actually doing making a website completely out of tables? Buddy before you learn to slice you need to learn to code.

Also you have 1 img in the CSS then everything else as far as i can see is tables....

Learn coding first and validate your (X)HTML and CSS and try using more CSS and less HTML. Try using more <div> tags in your HTML and controling your <div> tags in CSS firstly. Forget slicing my friend your no where near ready to code templates together even a simple template.

Whats this rubbish?

•
•
•
•
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
All this can be done in CSS and only people who no nothing about coding us the <body bgcolor="#fff"> its been "Depricated" which means is no longer semantic and is out with the romans.

Sorry to be harsh but images are your last thing... Learning coding first would make much more sense!!

Take the quiz on both HTML and CSS and see how you do here ok.

http://www.w3schools.com then like i said take both quiz then ask yourself are you ready to slice....I think not!!

Also wheres your DOCTYPE ? that goes above <html> if you don't have this it puts the broswers into quirks mode then anything can happen to your website. Looks ok in 1 Browser but look completely wrong in another.
Last edited by Wrams; Jun 29th, 2009 at 10:31 am.
Cheap Web Hosting
Reply With Quote Quick reply to this message  
Reply

Quick Reply to Thread
This thread is more than three months old.
Perhaps start a new thread instead?
•
•
•
•
•
•
•
•
Message:
•
•
•
•



Similar Threads
Other Threads in the Graphics and Multimedia Forum


Views: 16034 | Replies: 9
Thread Tools Search this Thread



Tag cloud for Graphics and Multimedia
3d 10 actionscript3 adobe adobeacrobat adobereader air ajax amazon amf apple button cart childprotection cloud dashboard dell design dojofoundation dreamweaver ebay eclipse ecommerce elasticcomputecloud embed endorsement extra family flash flash-develop flashlite flex flv free harddrive iamthwee ibm illustrator imflash intel interactivemap intro javafx javascript laptop legal map micron microsoft mobile monitoringsoftware moonlight multimedia myspace nand news novell panorama pdf pedophiles photoshop photosynth php safety sandisk security shopping silverlight solidstatedrive sproutcore ssd streaming swf table ukmap unload unwanted video vulnerability web white.space xml zend zephyr zeroday
About Us | Contact Us | Advertise | DaniWeb | Acceptable Use Policy | RSS Feed

©2003 - 2009 DaniWeb® LLC