This is long but it's step by step, you can print it out, or save it to your computer and copy / paste right from it, or both! This is WS4 advanced though so it'd good to know a little about coding, but it is mostly copy/paste. --------------------------------------------------------------Printing from iFrames tutorial wooohooo------------------------------------------------------- We're going to make two iFrames here so you can see how each work and it will be the same as this tutorials page that way. 1 Open up web studio and make a page let's call it "print". 2. Put an HTML object onto this page and paste into it the code below like this: (Right click on the HTML object select properties, then the HTML content tab, paste the code in that window and press "ok") ------------------copy the code below here and paste it into your first HTML object---------------------------- ------------------copy the code above here and paste it into your first HTML object---------------------------- The above is for the left frame on WS4advanced "print page" tutorial 3. Let's do it again, drag another HTML object onto your page and paste this code into it just like above. ------------------copy the code below here and paste it into your first HTML object---------------------------- ------------------copy the code above here and paste it into your first HTML object---------------------------- 4. Make both HTML objects 200 wide and 100 high, do that in the general tab. Okay you can preview now, you'll see two frames... let's make pages for those frames. ___________________________________________________________________________________ Oh if you want to leave the border off take this out style="border:6px double #fdbe02" If you want to change it then it border size, then style of border in this case double, then the color. For more on borders types see the image page on 4.0 advanced ______________________Removing or changing the border___________________________________ 5. Right, ready for those pages? Mkae one and call it PAGE1 exactly like that capitals n everything. 6. Make the second page, and name it PAGE2 Hey you can name these anything you want later, just remember to change the code too. 7. Now type PAGE 1 & PAGE 2 in the top left corners Let's preview again, press F5... now you have 2 frames with text in them. You see SRC="PAGE1.html" in the first code, that calls up that page, so if you change your page names change that part, in the second page I put it in a different spot it's src="PAGE2.html" but it does the same thing. Calls up page 2 and put it into the second iFrame. Let's put the print buttons on page 1 & 2 8. In each of those pages headers, paste in this code: ------------------copy the code below here and paste it into both pages header---------------------------- ------------------copy the code above here and paste it into both pages header---------------------------- 9. Now to get the print button onto those pages we need another HTML object so drag one of those onto each page and put it below the text, make 'em ohhhh around 100 wide x 24 high you can change that later when you position everything. 10. In each of those HTML object paste this code... (this is the last part 8^) hey it took me a while to figure this one out) ------------------copy the code below here and paste it into PAGE1 & 2's HTML object----------------------------
"> ------------------copy the code above here and paste it into PAGE1 & 2's HTML object---------------------------- You can even change the way that button looks in this part. style="font:bold 11px Comic Sans MS; color:#fdbe02; background-color:teal; PREVIEW.. finally... press F5 and you now have the print buttons. OKAY, this is it, the LAST step. Let's put links on the main page, that we called "print" so go there and type something. 4 different times, copy what I did on the tutorial page if you want like: 11. Type text for the iFrame links: Left page 1 Left page 2 Right page 1 Right page 2 I did that so you can see I'm putting in the left frame PAGE1 and so on... 12. Drag a page link onto each of the text, right from web studio's "page links" PAGE1 onto page 1 PAGE2 onto page 2 etc. 13. Target the frame, first look in the code again that's in the HTML objects on this page. You see where it says NAME="left" or name="right" That is the name of the frames, so if you need more just keep those names different. 14. We use this code for targeting a frame --------copy----------- TARGET=left --------copy----------- That will target the left frame, so all we do is padste that in where text links say left 15. Right click on the links that say left and select "edit HTML" paste it into that code like below: You'll see something like this: Left Page 1 Paste in the target like this: Left Page 1 16. Now do the same for the right framed links with TARGET=right PREVIEW, press F5, click on the links and the pages in the frames change. Pretty neato huh? Do a test print. You can put images on those pages like tickets, 10% off thingy's just don't make them too wide so they are "print friendly". Have fun! -------------------how to change the iFrame properties----------------------- HEIGHT="--": This defines the frame's height, in pixels or percentage. WIDTH="--": This defines the frame's width, in pixels or percentage. MARGINWIDTH="--": This sets the margin width in either pixels or percentage. MARGINHEIGHT="--": This sets the margin height in either pixels or percentage. SCROLLING="--":If the information inside the frame is too long to display, then a scroll bar will appear. You can stop it by adding this command set to"no." ALIGN="--": This where text will appear when surrounding the frame. NORESIZE: Add this, and the user will not be able to resize your frame. -----------------------------------------------------------------------------------------------------