1 / 21

If It’s Broke, Fix It! Page Formatting and Basic Fixes

If It’s Broke, Fix It! Page Formatting and Basic Fixes. Charity Katz Training Manager. Agenda. Understanding XML requirements Types of errors Debugging XSL Editing resources Using the inspector. XML. XML PCF and XSL = XML files eXtensible Markup Language

ugo
Download Presentation

If It’s Broke, Fix It! Page Formatting and Basic Fixes

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. If It’s Broke, Fix It!Page Formatting and Basic Fixes Charity Katz Training Manager

  2. Agenda Understanding XML requirements Types of errors Debugging XSL Editing resources Using the inspector

  3. XML XML • PCF and XSL = XML files • eXtensibleMarkup Language • Adheres to strict structure but can contain custom elements • Main requirements • Entities and markup are to be defined properly • Requires a root element • All tags must properly close • Tags and attributes are case sensitive and must be properly quoted • Elements must be properly nested

  4. Tag Defined based on needs Defines the structure of an XML document Can self-close or have a closing tag May contain attributes <p>This is awesome!</p> <img />

  5. Attributes Describe tags Differentiate between the same tags Values must be properly quoted Must use proper cases class="quote" src="/images/student.jpg"

  6. Element All of it put together! May contain child elements <p class="quote">This is awesome!</p> <imgsrc="/images/student.jpg" /> <p class="quote"><imgsrc="/images/student.jpg" /> This is awesome!</p>

  7. Prolog XML declaration • What version • Encoding PCF-stylesheet declaration • What XSL is transforming data • What extension should be appended <?xml version="1.0"encoding="UTF-8"?> <?pcf-stylesheet path="/_resources/xsl/default.xsl" extension="html" title="Web" ?>

  8. Doctype Definition Called DTD Defines the root element Provides the entities and markup <!DOCTYPE document SYSTEM "http://commons.omniupdate.com/dtd/standard.dtd">

  9. XML Tree

  10. XML Tree <document> <config> <parameter> </parameter> <meta /> </config> <content> <p> <img /> </p> <p> </p> </content> </document>

  11. XML Document <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE document SYSTEM "http://commons.omniupdate.com/dtd/standard.dtd"> <document> <config> <parameter> </parameter> <meta /> </config> <content> <p> <img /> </p> <p> </p> </content> </document>

  12. Any Questions?

  13. Identifying Errors Two main error types • PCF • XSL PCF errors commonly badly formed HTML • Remember: PCF content must follow strict HTML/XMLformatting XSL errors may be templating errors or badly formed HTML

  14. Debug XSL Details the parameters on the page Configured by XSL Useful in troubleshooting

  15. Editing Resources Text editors • OU Campus Source Code Editor • WebDAV for use with external editors XML validation • Publishing in Firefox/Chrome • External tools • http://validator.w3.org • http://www.w3schools.com/xml/xml_validator.asp • http://www.xmlvalidation.com/

  16. Inspectors Firefox Firebug add-on Chrome inspector

  17. Inspectors Edit HTML and CSS Observe console errors Edit JavaScript Review file load times

  18. Let’s Play!

  19. Q&A

  20. Don’t forget to complete your survey! http://outc14.com/surveys

  21. Thank you!

More Related