J 1.5 Template migration to J1.7 / 2.5 Kirk Hayes 2012 artistichosting.com.

Slides:



Advertisements
Similar presentations
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
Advertisements

MIS 425 Lecture 2 – HTML Navigation, Colors, tables and Styles Instructor: Martin Neuhard
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
Start menu -> all program -> Microsoft Visual SourceSafe-> Microsoft Visual Studio 2010 Click.
Very quick intro HTML and CSS. Sample html A Web Title.
Principles of Web Design 5 th Edition Chapter Nine Site Navigation.
SM5312 week 11: CSS Menus & Navigation Bars1 An Introduction to Cascading Style Sheets CSS Menus and Navigation Bars Nick Foxall.
Advance CSS (Menu and Layout) Miftahul Huda. CSS Navigation MENU It's truly remarkable what can be achieved through CSS, especially with navigation menus.
CIS 1310 – HTML & CSS 6 Layout. CIS 1310 – HTML & CSS Learning Outcomes  Describe & Apply the CSS Box Model  Configure Float with CSS  Designate Positioning.
Navigation Bars Level 2 Extended Certificate Unit B12 Doing Business Online.
1 Dreamweaver CS5 intermediate class by Cookie Setton Build a CSS website WITHOUT TABLES Just when you thought you were starting to understand HTML coding,
Web Pages and Style Sheets Bert Wachsmuth. HTML versus XHTML XHTML is a stricter version of HTML: HTML + stricter rules = XHTML. XHTML Rule violations:
กระบวนวิชา CSS. What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements Styles were added to HTML 4.0 to.
4.01 Cascading Style Sheets
What is Wordpress?  WordPress has a web template processor. Users can re-arrange widgets without editing PHP of HTML code; they can also install and.
CSS (Cascading Style Sheets): How the web is styled Create Rules that specify how the content of an HTML Element should appear. CSS controls how your web.
Web Development & Design Foundations with XHTML Chapter 6 Key Concepts.
Web Page Layout With CSS CSS Level 2 vs. Nested Tables Mike Wallick – 11/3/04.
Web Sites for amateur radio. So You want to make a Web Site? There are several things you need to know about web sites before you start to think about.
HTML & CSS A brief introduction. OUTLINE 1.What is HTML? 2.What is CSS? 3.How are they used together? 4.Troubleshooting/Common problems 5.More resources.
Web Design Dreamweaver Semester 2 ATBs. ATB #1 What is a web site?
Interface components is a term for all the supporting elements of a page’s content. Lists Menus Forms Tables This chapter focuses on using proper, valid.
XP Tutorial 7New Perspectives on Creating Web Pages with HTML, XHTML, and XML 1 Working with Cascading Style Sheets Creating a Style for Online Scrapbooks.
Today’s objectives  Complete web page  Using xhtml & CSS  Adding CSS to documents Embed url(File);  CSS.
CSS Sprites. What are sprites? In the early days of video games, memory for graphics was very low. So to make things load quickly and make graphics look.
Back to Table of Contents CAPA Website Tutorial Anne Dang, CCPA Webmaster for CAPA.
Basic Responsive Design Techniques. Let’s take a look at this basic layout. It has a header and two columns of text, in a box that is centered on the.
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 7 TH EDITION Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
 This presentation introduces the following: › 3 types of CSS › CSS syntax › CSS comments › CSS and color › The box model.
Copyright © Eric Liria Web Site Builder This application allows you to build and manage web sites. It provides the following functionnalities: use.
IT Introduction to Website Development Welcome!
Web Design I Spring 2009 Kevin Cole Gallaudet University
Web Development & Design Foundations with HTML5 7th Edition
Copyright © Terry Felke-Morris WEB DEVELOPMENT & DESIGN FOUNDATIONS WITH HTML5 Chapter 6 Key Concepts 1 Copyright © Terry Felke-Morris.
Introduction to CSS Layout
Cascading Style Sheets Primary readings Presentations Explain & review projects with class mates.
Web Development & Design Foundations with XHTML Chapter 6 Key Concepts.
CONTROLLING Page layout
1.Getting Started 2.Modifying Design 3.Newsletter Templates 4.Announcement 5.Administer Sections Index Training 14 th Mar., 2011.
Group 9: Through examples, explain how to build a css navigation bar. Presented by: Daniel Ku, Matt Iannacci & Iphia Henry.
Stylizing a Navigational Menu Web Design Section 6-3 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.
 Add one element at a time  If it doesn’t do what you want, › Delete it › DON’T just keep piling on more items.
Simple Website Layout Tutorial Using HTML 5 and CSS 3 Ref: layout-tutorial-html-5-css-3/
INT222 – Internet Fundamentals Week 8: Using New HTML features 1.
Joomla Awdhesh Kumar Singsys Pte Ltd. What is Joomla? Joomla is an award-winning content management system (CMS), which enables you to build Web sites.
NAVIGATION USING HTML TO SET UP THE BASIC STRUCTURE OF A NAV BAR.
Online Portfolios: The New Way to Market Yourself Donna Love & Leslie Martin Gaston College.
Introduction to CSS Layout
CONTENT MANAGEMENT SYSTEM CSIR-NISCAIR, New Delhi
>> Navigation and Layouts in CSS
4.01 Cascading Style Sheets
CSS Layouts: Positioning and Navbars
Semester - Review.
Google fonts CSS box model
Using Cascading Style Sheets Module B: CSS Structure
Box model.
Simple Way to Manage WordPress Ads with AdRotate Plugin Guided By:- wpglobalsupport.comwpglobalsupport.com.
Web Development & Design Foundations with HTML5 7th Edition
Chapter 7 Page Layout Basics Key Concepts
Web Development & Design Foundations with HTML5 8th Edition
Web Development & Design Foundations with HTML5
The Internet 10/25/11 XHTML Tables
Easy Way to Improve Your 404 Page Template in Wordpress If you want to improve your 404 error page. So we are here to explain to you how to improve your.
CSS Box Model.
Float Property Elements that seem to “float" on the right or left side of either the browser window or another element are often configured using.
Web Development & Design Foundations with HTML5
Responsive Grid Layout with Bootstrap
Web Development & Design Foundations with HTML5
CSS and Class Tools.
4.01 Cascading Style Sheets
Presentation transcript:

J 1.5 Template migration to J1.7 / 2.5 Kirk Hayes 2012 artistichosting.com

Online Resources that I stole from or read on how to do this templates.html for-joomla-16 o_Joomla_1.6 template-upgrade-tutorial-part-1

3 Files Only !!! index.php templateDetails.xml template.css If you have a theme there will be more files! In my case I had to also edit red.css

Website Migration J1.5 install J1.7 install Commercial product called SP Upgrade Results are here: s/com_spupgrade/log.htm

Immediately After Migration! Menu’s are messed up! Modules are messed up!

Index.php Line 4 defined( '_JEXEC' ) or die( 'Restricted access' ); becomes defined('_JEXEC') or die;

Index.php Jfactory $app = JFactory::getApplication(); you'll need to change any occurence of $mainframe with $app For instance you'd change: $mainframe->getCfg('live_site'); to $app->getCfg('live_site'); or change $mainframe->getCfg('sitename'); to $app->getCfg('sitename');

Template XML Changes to J1.5: J1.7:

Template XML Parameters J 1.5 J 1.7 The biggest change you'll notice is that you can now group template parameters into a, which is incredible useful for templates with lots of parameters.

CSS Changes template_css.css menu.css red.css

Basic CSS Changes*.article_separator is now.item-separator.blog_more is now.items-more For the [Print, PDF, ] button in an article, there use to be a so you'll need to add something like:.actions{ margin:0; }.actions li{ list-style: none; display:inline; float:right; }

Login Form* Breaks have been removed from the Login Form module so now the labels are inline. If you'd like to put them back on their own line add: #form-login #form-login-username label, #form-login #form-login-password label{ display:block; }

Category Table* The Category Table view is now an Unordered List so you'll need to add something like table.category{ border:1px solid #CCC; width:100%; text-align:center; } table.category th,table.category td{ padding:2px 6px; } table.category thead{ background:#EEE; }.jcat-children ul,.jcat-children li{ margin:0; list-style:none; }.jcat-children li a{ background:url(../images/bullet_green_arrow.png) no-repeat 0 12px; display:block; padding:5px 5px 5px 15px; font-size:0.9em; }

Template_css.css Line 306 Unifying all the Unordered Lists and their corresponding List Items to look like the old website.

Template_css.css Line 392 This is to fix the content alignment of the text in the new template

Menu.css Changes Lines { /* added for child menus when converting to j1.7*/ /*color: #585857;*/<-OLD Value color:#FFF; <-NEW Value }

Red.css Changes Line

Red.css Changes Line Joomla 1.5 content used featured articles with sections and categories styled differently, but new Joomla has built in styling that is not found in Joomla 1.5. To make the new site and old site look similar we had to figure out which css properties were being defined for our new home page content. Then we had to add the old styling to those new div’s in our css file.

Red.css Changes Line The modules Popular and Latest News articles all had lines under them, so I removed that by adding the text- decoration: none; However, I only wanted to effect the latest news and popular classifications thus the code I used was the following:

Questions? artistichosting.com