Development
Web Development
Joomla
Template Creator CK - Creating Custom Joomla templates
3.2 (29 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
101 students enrolled

Template Creator CK - Creating Custom Joomla templates

Template Creator CK enables you to create Joomla templates from an existing design.
3.2 (29 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
101 students enrolled
Created by Andries Bester
Last updated 11/2015
English
English [Auto]
Preview this course
Template Creator CK - Creating Custom Joomla templates
Current price: $11.99 Original price: $19.99 Discount: 40% off
1 day left at this price!
Buy now
30-Day Money-Back Guarantee
This course includes
  • 2.5 hours on-demand video
  • 4 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Create a custom Joomla template based on an existing design.
Course content
Expand all 97 lectures 02:19:49
+ – Introduction
4 lectures 04:48

After completing this lesson, students will be introduced to the instructor and will be introduced to the concepts to be learned in this course.

Introduction 1
Preview 01:09

After completing this course, students will know which skills are required in order to maximise their learning experience.

Introduction 2
01:45

After completing this lesson, prospective students will know who this course is designed for and what the expected outcome will be.

Introduction 3
Preview 01:04

After completing this lesson, students will know where and how they can purchase the Template-Creator CK component by following the link.

Introduction 4
Preview 00:50
+ – Starting Out
12 lectures 27:31

After completing this lecture, students will be able to install template creator CK into Joomla

Installing the component
00:55

After completing this lesson, students will be familiar with the initial layout of the component within Joomla.

Exploring the component
01:58

After completing this lesson, students will be familiar with the required information needed to proceed with creating a template.

Basic information on the template
01:31
After completing this lesson, students will have learned more about template creator CK and it's interface.
The component interface I
Preview 03:37

After completing this lesson, students will have learned more about template creator CK and it's interface.

The component interface II
02:12
After completing this lesson, students will have learned more about template creator CK and it's interface.
The component interface III
01:25
Building from an existing design
01:03

After completing this lesson, students will start thinking about slicing designs into modules and components.

Thinking in grid 1
00:54
After completing this lesson, students will start thinking about slicing designs into modules and components.
Thinking in grid 2
01:08
After completing this lesson, students will have learned how to install custom fonts into template creator CK
Installing fonts
04:27
After completing this lesson, students will have learned how to define their template's global parameters.
Defining your global parameters
07:04
After completing this lesson, students will have learned how to install their template into Joomla via template creator CK.
Installing the template
01:17
+ – Creating the navigation
16 lectures 16:38
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 1
Preview 00:26

After completing this lesson, students will be well on their way in creating the navigation area of the template.

Creating the navigation 2
Preview 00:32

After completing this lesson, students will be well on their way in creating the navigation area of the template.

Creating the navigation 3
Preview 01:17
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 4
01:12
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 5
00:29
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 6
00:34
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 7
02:12
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 8
00:40
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 9
01:15
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 10
02:07
After completing this lesson, students will be well on their way in creating the navigation area of the template.
creating the navigation 11
01:08
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 12
01:08

After completing this lesson, students will be well on their way in creating the navigation area of the template.

Creating the navigation 13
00:22
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 14
02:05
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 15
00:25
After completing this lesson, students will be well on their way in creating the navigation area of the template.
Creating the navigation 16
00:46
+ – Creating the hero area
6 lectures 08:48

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 1
Preview 00:38

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 2
Preview 00:40

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 3
01:52

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 4
00:56

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 5
01:43

After completing this lesson, students will continue learning how to create the hero area of the template.

Creating the hero area 6
02:59
+ – Creating the aligned modules
14 lectures 18:05

After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.

Creating the aligned modules 1
Preview 02:27
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 2
Preview 01:04
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 3
01:06
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 4
01:11
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 5
01:54
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 6
01:51
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 7
00:59
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 8
00:49
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
Creating the aligned modules 9
00:30

After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.

Creating the aligned modules 10
01:24
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
creating the aligned modules 11
02:23
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
creating the aligned modules 12
00:56

After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.

creating the aligned modules 13
01:10
After completing this lesson, students will be comfortable adding modules to the template, and styling them with CSS via Template Creator's interface.
creating the aligned modules 14
00:21
+ – Styling the component area
11 lectures 16:01
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 1
Preview 00:55
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 2
Preview 00:44
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 3
01:56
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 4
01:59
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 5
02:12
After completing this lesson, students will continue learning how to style the component area of the template.
Styling the component area 6
01:52
After completing this lesson, students will continue learning how to style the component area of the template.
styling the component area 7
01:16
After completing this lesson, students will continue learning how to style the component area of the template.
styling the component area 8
02:09
After completing this lesson, students will continue learning how to style the component area of the template.
styling the component area 9
01:37
After completing this lesson, students will continue learning how to style the component area of the template.
styling the component area 10
01:02

After completing this lesson, students will continue learning how to style the component area of the template.

styling the component area 11
00:19
+ – Creating the footer area
3 lectures 04:29
After completing this lesson, students will continue learning how to style the footer area of the template.
creating the footer 1
01:57
After completing this lesson, students will continue learning how to style the footer area of the template.
creating the footer 2
01:58
After completing this lesson, students will continue learning how to style the footer area of the template.
creating the footer 3
00:34
+ – Developer tools, firebug and template overrides
8 lectures 14:25

After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.

Developer tools and template overrides 1
Preview 01:54

After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.

Developer tools and template overrides 2
Preview 02:16

After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.

Developer tools and template overrides 3
03:41
After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.
Developer tools and template overrides 4
01:06
After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.
developer tools 5
01:20
After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.
developer tools 6
01:16

After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.

developer tools 7
01:00
After completing this lesson, students will continue learning about google developer tools and firebug, editing css within the browser and identifying elements we want to change within our templates structure.
developer tools 8
01:52
+ – Adding design flair
9 lectures 10:18

After completing this lesson, students will continue learning about adding custom css to our template.

Adding design flair
Preview 00:25
After completing this lesson, students will continue learning about adding custom css to our template.
Adding design flair 2
Preview 00:51
After completing this lesson, students will continue learning about adding custom css to our template.
Adding design flair 3
Preview 00:55

After completing this lesson, students will continue learning about adding custom css to our template.

Adding design flair 4
00:56
After completing this lesson, students will continue learning about adding custom css to our template.
Adding design flair 5
01:11
After completing this lesson, students will continue learning about adding custom css to our template.
Adding design flair 6
01:42

After completing this lesson, students will continue learning about adding custom css to our template.

Adding design flair 7
00:45

After completing this lesson, students will continue learning about adding custom css to our template.

Adding design flair 8
01:47
After completing this lesson, students will continue learning about adding custom css to our template.
Adding design flair 9
01:46
+ – Creating a favicon
3 lectures 02:45
After completing this lesson, students will be comfortable adding a favicon to the template.
Adding a favicon 1
00:29
After completing this lesson, students will be comfortable adding a favicon to the template.
Adding a favicon 2
00:45
After completing this lesson, students will be comfortable adding a favicon to the template.
Adding a favicon 3
01:31
Requirements
  • You should already be familiar with HTML and CSS
  • You should have a solid knowledge of Joomla or Wordpress.
  • Students will need to purchase the component Template Creator CK but not yet install install it.
Description

There's an absolute bevy of courses on the internet on how to build websites using all kinds of platforms and frameworks. Although these courses are generally very helpful in teaching more about certain topics like HTML and CSS, I have yet to come across a course that shows you how to create a custom template from scratch.

After doing multiple online courses on the internet to teach myself web development, I realised that teaching others my workflow could not only save them lots of time, but give them a solid understanding of a tool that has become one of the most powerful in my arsenal.

The objective of this course is to run you through a step by step process on how to create a custom template using a component called Template Creator CK. This component can be installed into Joomla and Wordpress, and operates inside the CMS to make the creation of templates from scratch an absolute breeze.

The course is structured in a top down approach, where students will take an existing design and start creating the template from the navigation area, all the way down to the footer area. Thereafter we will look at concepts like responsive design, template overrides and adding custom CSS to the template to add some aesthetically pleasing effects with CSS transitions and transforms.

Students wishing to enroll should already be familiar with HTML, CSS and either Joomla or Wordpress. Although Joomla is the preferred CMS for this course, Template Creator CK will soon be available for Wordpress, so if you have a solid understanding of the skillsets covered here, you can extend the utility of this course to create templates for Wordpress as well.

The total runtime of the course is roughly 2.5 hours, but I would recommend doing each section slowly and practicing the concepts taught to get the most out of the material. Students will need to purchase the Template Creator CK component, but I can assure you it will be money well spent.

Taking this course will teach you a fantastic new way of creating beautiful, versatile and responsive templates for the two biggest CMS's out there today.

Who this course is for:
  • Students should take this course if you have a solid knowledge of HTML, CSS and Joomla
  • This course is not intended for those looking to learn web design.
  • This course is not intended for those looking to learn Joomla or Wordpress