W604 - Using Style Sheets to Update B2B Seller

Transcription

1 W604 - Using Style Sheets to Update B2B Seller Pre-requisites: Basic HTML Knowledge This advanced session focuses on the differences among the various concepts of web development. The review will focus on HTML, style sheets, and JavaScript. This purely technical class will also cover how Activant uses these tools in our B2B Seller offerings. Joseph Wojciechowski Implementation Services Wednesday, 3:45 p.m. 2 Session Objectives Why should I use style sheets? What is a style sheet? The history of styles Okay, I want to use style sheets! Tips and tricks

2 3 First, a Little About Myself Joseph Wojciechowski Attended Rensselaer Polytechnic Institute B.S. in Electronic Media, Arts, Communication User interface designer / web designer Enjoys creating Flash, running, Polish food 4 Return on Investment Opportunity Why should I use style sheets? After you learn how to use style sheets to update your web site, you will be able to update your site whenever you want You will save! Time Money Resources Frustration

3 5 What Is a Style Sheet? ONE easy-to-use file Has a.css extension ( MyStyles.css) Controls the presentation of web pages Font color Font size Font type Tons more! One CSS can control 1 page or 1,000 pages! But first, a history lesson 6 The History of Styles Part I Old styles No standardization Tedious Confusing Boring and bland Lets see some examples!

4 7 The History of Styles Part II New Styles Standardized Centralized User friendly More choices! Lets see some examples! 8 Anatomy of a Style.StyleName { attribute: value; attribute: value; (as many as you want) attribute: value; }

5 9 Anatomy of a Style: Example.RFQShoppingCart_SubTotalLabel { font-family: Arial, sans-serif; font-size: 12px; font-weight: bold; color: #ffffff; } 10 Okay, I Want to Use Style Sheets! Find your style sheet Log into web server Local FTP Stylesheets directory StylesXXXXXX.css XXXXXX = company code Copy file to your PC Desktop or any folder

6 11 Editing the Style Sheet Make a backup copy Right-click file Copy Paste Rename file StylesXXXXXX-BACKUP.css Make a backup Make a backup No, really, MAKE A BACKUP 12 What Do You Want to Change? I have my style sheet, now what? Find what you want to change Go to your web site in Internet Explorer Copy item to change View -> Source Find the item to change Locate the style name Copy style name

7 13 Editing the Style Sheet Open the style sheet with Notepad Find the style you want to change Edit -> Find Paste in style name Find 14 Editing the Style Sheet Change, add, or edit the style Save the file Upload it back to the Stylesheets directory Overwrite existing file Upload backup Preview changes Refresh your browser

8 15 Summary What is a style sheet? One easy-to-use file Controls the presentation of information Can be edited with a simple text editor How do I edit the style sheet Download the style sheet Make a backup! Find what you want to change Edit the file Save and upload! 16 Suggested Action Plan Read up on the CSS resources and basic HTML Practice CCS on basic web pages Make changes to your live site to utilize and hone this skill

9 17 Additional Resources Web Monkey esheets/index.html W3Schools 18 Thank You for Attending W604 - Using Style Sheets to Update B2B Seller Joseph Wojciechowski Please submit the Session Feedback Form To receive NASBA credits, please be sure to complete the Session Feedback Form and sign the class roster in the back of the room

10

11 Session Feedback Form Summit 2007 Las Vegas, NV Please take a moment to evaluate this session and offer feedback. Activant uses your input to understand your needs and to determine future Summit sessions. Session Name: Session Number: Presenter s Name: How important is this topic to your job/company? Not Important Important Please rate the educational value you received from this session Low Value High Value 1. What software are you currently using? 2. How long have you personally used this software? 3. Describe the effectiveness of your instructor. 4. What is your overall evaluation of this session? 5. What could have been done to improve this session? 6. What sessions would you like to see presented at future conferences? 7. What issues will be critical to your business in the next months? Check here if you would like CPE credits. To receive credits, be sure to sign your name at the bottom of this form and sign the roster in the session room. Answering the following questions is OPTIONAL (but required for CPE Credits). Yes No Did this session meet your expectations, based on the description/objectives in the registration materials? Were the pre-requisite requirements stated in the course description appropriate? Did the session materials contribute to achieving the learning objectives? Did the equipment (screen, microphone, projector, etc.) in the room enhance the instruction? Was the time allotted for the session appropriate for the topic? Name: Company: