Brief Explanation of the Omega Video Series

Video loading...

  • 0:00
    [Drupalize.Me] [Learn Drupal]
  • 0:06
    [Brief Explanation of the Omega Video Series] [Introduction to Omega 3.x] [Chapter 1]
  • 0:10
    [with Addison Bery]
  • 0:12
    Omega is a Drupal base theme that provides you with a really nice responsive framework.
  • 0:18
    And one of the really nice things about using Omega
  • 0:21
    is that it provides a lot of configuration that
  • 0:23
    happens in the UI rather than in code.
  • 0:26
    So, you can spend a lot of time configuring things
  • 0:29
    and making sure that your responsive framework--
  • 0:31
    the grid that you want to use--
  • 0:33
    is all set up--in just the UI you can export that into code--
  • 0:38
    and by doing that you end up being able to spend a lot more time
  • 0:43
    just making your site look really awesome
  • 0:45
    and spending time playing with the CSS that you know and love,
  • 0:49
    rather than taking the time to set up responsive framework,
  • 0:53
    and grid frameworks, and things like that.
  • 0:55
    In this series, we're going to be demonstrating the Omega module
  • 0:59
    by actually converting an existing Drupal theme into an Omega sub-theme.
  • 1:04
    So, what we're going to be doing is looking at the 960 Robots theme,
  • 1:08
    and 960 Robots has--obviously it has HTML and CSS--
  • 1:13
    it also has a fair number of customizations.
  • 1:16
    It has template files.
  • 1:17
    It has things going on in template.php,
  • 1:20
    and we're going to be making sure that all of those things
  • 1:22
    get converted over into our new Omega sub-theme that we're going to create.
  • 1:27
    So, in this series, what we'll be looking at is
  • 1:31
    how to actually create a new sub-theme with Omega,
  • 1:34
    and then we're going to walk through the steps
  • 1:37
    of taking what we would commonly in a regular Drupal theming world,
  • 1:42
    look at the page template file,
  • 1:44
    and how do you make those pieces fit into the Omega framework and terminology.
  • 1:49
    And then we'll talk about the CSS that's involved.
  • 1:54
    What are the CSS files that Omega's giving us?
  • 1:56
    How do you use those?
  • 1:58
    How do those pieces go together?
  • 2:00
    Making sure that we have things in the right place,
  • 2:02
    we'll be working with theme functions and
  • 2:04
    looking at the Omega best practices around how to break out your theme functions
  • 2:10
    and where to put those and how to use them.
  • 2:12
    Working with Omega, we expect that you already know
  • 2:16
    how to install and work with a basic Drupal 7 site,
  • 2:20
    and we also expect that you understand basic Drupal theming practices.
  • 2:27
    We're going to be working with template files and theme functions,
  • 2:30
    and if you don't understand how those work in just sort of regular Drupal theming,
  • 2:37
    explaining how that stuff happens within Omega might be a little bit confusing.
  • 2:42
    So, it's really good for you to brush up on those things if you're not familiar with them,
  • 2:46
    and we do have basic and advanced theming videos on Drupalize.Me.
  • 2:51
    And then the last thing is that you should also, of course,
  • 2:54
    have a basic understanding of HTML and CSS.
  • 2:56
    We're definitely going to be working with HTML,
  • 2:59
    looking at HTML, looking at our CSS files,
  • 3:02
    and explaining how they work together.
  • 3:03
    And so, having a basic understanding of how that stuff works
  • 3:06
    before you dive into this is going to make your journey a lot better.
  • 3:09
    We're going to stay focused on Omega in these lessons.
  • 3:14
    We're not going to dive into a lot of detail about what responsive design is.
  • 3:18
    There is a lot of information out there on the Web about that,
  • 3:21
    but we want to stay very focused on Omega itself,
  • 3:25
    and the framework, and the tools that it provides for you
  • 3:27
    to achieve a responsive theme on your site.
  • 3:30
    If you're interested in finding out more about that stuff to come up to speed a little bit,
  • 3:35
    we do also have a video on Drupalize.Me called Responsive Drupal Today,
  • 3:39
    which was actually done by Jake Strawn,
  • 3:41
    who is the original developer and the creator of the Omega theme.
  • 3:45
    So, you might want to check that out.
  • 3:48
    So, let's go ahead and get started creating our Omega responsive theme.
  • 0:00
    [Drupalize.Me] [Learn Drupal]
  • 0:06
    [Breve descripción de la Omega Video Series] [Introducción a Omega 3.x] [Capítulo 1]
  • 0:10
    [con Addison Bery]
  • 0:12
    Omega es un tema base de Drupal, que te provee con un excelente framework responsive.
  • 0:18
    Y una de las cosas más lindas de usar Omega
  • 0:21
    es que te ofrece un montón de configuraciones que
  • 0:23
    se manejan desde la Interfaz de Usuario, en vez que desde el código.
  • 0:26
    Así, puedes pasar un montón de tiempo configurando cosas
  • 0:29
    y asegurándote de que tu framework responsive--
  • 0:31
    el grid que quieres usar--
  • 0:33
    funcionan correctamente-- A través de la interfaz de usuario puedes exportar la configuración a código--
  • 0:38
    y al hacer esto, puedes pasar mucho más tiempo
  • 0:43
    dedicándote a hacer que tu site sea asombroso
  • 0:45
    y dedicando tiempo a jugar con el CSS que conoces y amas,
  • 0:49
    en lugar de utilizar el tiempo configurando un framework responsive,
  • 0:53
    y frameworks grid y cosas por el estilo.
  • 0:55
    En esta serie, vamos a mostrarte el módulo Omega
  • 0:59
    para convertir un tema existente de Drupal en un sub-tema de Omega.
  • 1:04
    Entonces, lo que vamos a hacer es observar el tema 960 Robots,
  • 1:08
    el cual tiene, desde luego, HTML y CSS;
  • 1:13
    también tiene un buen número de personalizaciones.
  • 1:16
    Tiene archivos de plantillas.
  • 1:17
    Tiene lógica implementada en el template.php,
  • 1:20
    y vamos a asegurarnos de que todas esas cosas
  • 1:22
    se conviertan a nuestro nuevo sub-tema de Omega que vamos a crear.
  • 1:27
    Entonces, en esta serie, lo que vamos a ver es
  • 1:31
    Cómo crear un nuevo sub-tema con Omega,
  • 1:34
    y luego vamos a ver los pasos
  • 1:37
    que normalmente se realizarían en el mundo del theming de Drupal,
  • 1:42
    veremos el archivo de plantilla de una página,
  • 1:44
    y cómo hacer que estas piezas encajen en la terminología y el framework de Omega.
  • 1:49
    Y luego vamos a hablar sobre el CSS relacionado.
  • 1:54
    Qué archivos CSS nos ofrece Omega?
  • 1:56
    Cómo se usan?
  • 1:58
    Cómo se ensamblan esas piezas?
  • 2:00
    Asegurándonos de tener las cosas en el lugar correcto,
  • 2:02
    vamos a trabajar con las funciones del tema y
  • 2:04
    veremos las mejores prácticas de Omega sobre cómo estructurar las funciones de tu tema
  • 2:10
    así como dónde y cómo usarlas.
  • 2:12
    Para trabajar con Omega, esperamos que ya conozcas
  • 2:16
    cómo instalar y trabajar con un sitio básico de Drupal 7,
  • 2:20
    y también esperamos que entiendas las prácticas básicas de theming con Drupal.
  • 2:27
    Vamos a estar trabajando con plantillas y funciones de theming,
  • 2:30
    y si no comprendes cómo estas funcionan en un tema básico de Drupal,
  • 2:37
    explicar cómo eso sucede dentro de Omega puede resultarte un poco confuso.
  • 2:42
    Así, sería bueno para ti ponerte al día en estas cosas, si no estas familiarizado con ellas,
  • 2:46
    y nosotros tenemos vídeos básicos y avanzados sobre theming en Drupalize.Me.
  • 2:51
    Y luego, la última cósa que debes de tener, por supuesto,
  • 2:54
    es tener un conocimiento básico del HTML y CSS.
  • 2:56
    Definitivamente vamos a trabajar con HTML,
  • 2:59
    míraremos el HTML, míraremos nuestros archivos CSS,
  • 3:02
    y explicaremos cómo trabajan juntos.
  • 3:03
    Y así, teniendo un conocimiento básico de cómo funcionan estas cosas
  • 3:06
    antes de zambullirnos, todo esto hará que tu viaje vaya mucho mejor.
  • 3:09
    Vamos a centrarnos en Omega en estas lecciones.
  • 3:14
    No vamos a profundizar con muchos detalles sobre lo que el diseño responsive es.
  • 3:18
    Hay un montón de información sobre esto en la Web,
  • 3:21
    pero queremos estar muy enfocados en Omega en sí,
  • 3:25
    y el framework, y las herramientas que te provee
  • 3:27
    para conseguir un tema responsive en tu site.
  • 3:30
    Si estás interesado en encontrar más sobre estas cosas, para poder ir más rápido
  • 3:35
    también tenemos un video en Drupalize.Me llamado Responsive Drupal Today,
  • 3:39
    el cual fue elaborado por Jake Strawn,
  • 3:41
    el cual es el desarrollador original y el creador del tema Omega.
  • 3:45
    Por lo que, es posible que desees darle un vistazo.
  • 3:48
    Así pues, sigamos adelante y empecemos a crear nuestro tema responsive con Omega.
Loading ...

Brief Explanation of the Omega Video Series

Loading...

Omega is a Drupal base theme that provides you with a really nice responsive framework. Omega also provides a lot of configuration options that are accessed through the UI rather than code. So, you can adjust the display settings and know that the underlying framework will be intact.

In this series, we're going to be demonstrating the Omega module by converting an existing Drupal theme into an Omega sub-theme. We'll talk about the HTML and CSS that's involved, and how they work together. We'll be working with theme functions and looking at the Omega best practices around how to break out your theme functions, where to put those, and how to use them.