Drupal/C3/Installing-an-Advanced-Theme/English

Title: Installing an Advanced Theme

Keywords: Drupal, Video tutorial, Themes, contributed Themes, Zircon Theme, Adaptive theme

Visual Cue	Narration
Slide 1: Installing an Advanced Theme	Welcome to the Spoken tutorial on Installing an Advanced Theme.
Slide 2: Learning Objectives	In this tutorial, we will learn to install an advanced theme
Slide 3: System requirement	To record this tutorial, I am using Ubuntu Linux Operating System Drupal 8 and Firefox Web browser You can use any web browser as per your choice.

Time	Narration
0:11	Adaptive theme and Omega are 2 amazing Theme frameworks.
0:24	Let's take a look at Adaptive theme.
0:29	Note that Adaptive theme is a Basic Theme.
0:33	You need to use a Sub-Theme for Adaptive Theme.
0:44	Let us install Adaptive Theme.
0:48	Depending on when you are watching this video, you might see Drupal 8 up here in green. Take the Drupal 8 that's in the green and not in red.
1:02	Right-click on the tar.gz link.
1:05	Select Copy link option.
1:07	Let's come back to our website.
1:09	Click on Appearance and Install new theme.
1:12	Paste the link here and click on Install.
1:15	Now we don't turn this one on because Adaptive Theme is a Base Theme.
1:25	Let's now get a Sub-Theme Pixture Reloaded.
1:51	Scroll down and locate the Drupal 8 version. When you watch this tutorial, it will be up here in the green section.
2:01	Right-click on the tar.gz link and select Copy link.
2:03	Back to the site. Click on Install new theme button. Paste the link here and click on Install.
2:13	Now, click on Install newly added themes.
2:16	Scroll down. We will find Adaptive Generator and Adaptive Sub-theme called Pixture Reloaded.
2:24	Click on Install and set as default.
2:29	Click on Settings.
2:34	There is a difference between a simple theme and a base theme with its own sub-theme.
2:43	There are settings for almost everything here. We can change just about anything.
2:50	For instance, we can have Responsive menus.
2:53	Fonts from Google or Typekit.
2:56	Separate styles for Titles.
2:58	Image alignment.
2:59	Shortcode CSS Classes.
3:03	Mobile Blocks - which allow us to hide blocks on mobile devices.
3:06	Slideshows are supported. Touch icons, Custom CSS, more Developer tools and Legacy browser settings for IE 6 to 8. Please use these with caution. Don't enable them unless you need them.
3:22	Under Extensions in the left panel, we have Responsive menus. Fonts. Image Settings for ARTICLE BOOK PAGE EVENTS It recognises all of those Content types.
3:31	Let me click on EVENTS. This allows us to align our images in our Events Content type.
3:37	For instance, whether we want them always to be floated to the left or to the right.
3:43	Back to the left panel. Shortcodes and Markup Overrides.
3:47	There are more options here below. Click on LAYOUTS and then on PAGE (DEFAULT). Now click on WIDE option. This allows us to set up all the layouts with the Block regions and also to define the Media queries right here, inside the theme.
4:03	We will need some time to set this up properly.
4:08	Now click on COLOR SCHEME. There are many predefined color schemes. But if you don't like the ones that come with it, then you can build your own color scheme.
4:16	Lastly, there are the normal Basic settings.
4:20	This is an amazing base theme and sub-theme for our Drupal site.
4:28	We have not really made any changes here. But let's go and take a look at our Homepage.
4:35	We see a brand new look and feel for our Homepage.
4:40	We will need to go into Structure and check our Block layout. We have used the Sub-Theme Pixture Reloaded.
4:49	There are no Sidebar regions here. Everything in Pixture Reloaded is just listed this way.
4:56	Maybe it was not the best choice for our demonstration.
5:03	But you get the idea of how powerful it is. We can just go in and set up all of those options using this advanced theming engine.
5:15	That's the theme framework – Adaptive theme and Pixture Reloaded. You can play around with these to understand them thoroughly.

	With this we come to the end of this tutorial.
Slide 5: Summary	Let us summarize. In this tutorial, we have learnt to install an advanced theme.
Slide 6: Acknowledgement	This video is adapted from Acquia and OSTraining and revised by Spoken Tutorial Project, IIT Bombay.
Slide 7: Acknowledgement	The video at this link summarises the Spoken Tutorial project. Pls download and watch it.
Slide 8: Spoken Tutorial Workshops	The Spoken Tutorial Project Team conducts workshops and gives certificates. For more details, please write to us.
Slide 9: Acknowledgement	Spoken Tutorial Project is funded by NMEICT, Ministry of Human Resource Development and NVLI, Ministry of Culture Government of India.
	This is Vanessa Varkey signing off. Thanks for joining.

Contributors and Content Editors

Nancyvarkey, Priyacst