Monday 14 November 2011

Create your own Beamer template

For the past couple of days, I had been searching for a tutorial that would show how to create a custom Beamer template. I found some great resources and some really great customized templates (I have listed the ones that I referred to below) but none indicated how should I go about it. There was just lines and lines of code and for someone like me, who is programmatically challenged, the task of creating my own template seemed very daunting. So I slowly started reading some of code that I found and tried to made sense of. I did eventually succeed but not entirely.

I did manage to create my own template but is relatively much simpler as compared to the ones that I saw over the internet. But this did get me started, so I am hoping that anybody who's looking for a decently documented procedure on the topic would find this post helpful. The code is relatively simple, both to understand and execute (I hope).

One of the best documents to understand Beamer is the Beamer user guide. It explains the Beamer mechanisms very well and I used it as one of the major references while preparing this template. According to the guide, Beamer presentations have five flavours of themes

  1. Presentation themes - Every aspect of the presentation is detailed here. The colour, the font, the way the bullets look. The way the enumeration goes. The size and position of the logo etc.
  2. Colour themes - Just of the colour details. This can be created as a separate file from the presentation theme and then later called with other presentation themes. I will explain this below. In fact, let's just enumerate the other three and jump to the explanation of how all this connects.
  3. Font themes
  4. Inner themes - Design the elements that are "inside" the frame like the environments, theorems, blocks etc.
  5. Outer themes - Design the outer space of the frame like the headline, footline, sidebar etc. 
To create a Beamer theme we need to specifiy four types of details-- colour, font, inner, outer. These details can be mentioned in the presentation theme itself or can be created as different files and then called in the TeX document. It is actually advisable to create them as separate files since this will allow us to use these specific themes with other presentation themes as well by just calling these in the TeX document. Additionally, it is also a more efficient way of working. For example, let's say that we like the overall feel of the Pittsburgh theme but just want to change the colours from blue to black. Then we need to just create the colour theme file and call it in the TeX document. This wouldn't be possible if we had just created one file with all the details. Let's just try to create a simple theme and see how it goes.

%%%%%%%%%%-------------------------------------------%%%%%%%%%%%%
%                             File created: 9 Nov, 2011
%
% This beamer style file was created just for experminetation and learning.
% The file is pretty much self-explanatory and as of 10 Nov, 2011, pretty much bug free (This is because I really don't know what "bugs" are and/or how to find them.
% Howvere, in case you find and bugs, issues, or have any suggestions/comments, please feel free to contact me at programming-r-pro-bro.blogspot.com
%
%
%
%%%%%%%%%%-------------------------------------------%%%%%%%%%%%%


% This style file is a combination of the four files required to create the Moo beamer theme.

% 1. Inner
% 2. Outer
% 3. Color
% 4. Font
% You can directly use this file instead of the using the other theme file "beamerthemeMoo-whole.sty" and calling the 4 styles in the TeX document.




%%% Defining the preamble
\mode<presentation>
\usepackage{pgfcomp-version-0-65}
\usepackage{color}


%%%%%%%%%%%%%%
%%
%% Color theme
%%
%%%%%%%%%%%%%%




%%%%%%
% We need to define a set of colours that will be assigned to various parts of the presentation. I personally believe that Beamer already does have some great themes, so if we really want to build our own, we will have go to the tiniest of details and tweak them.
%%%%%%





%%%%%%
% LaTeX, like R, has a huge set of colours to choose from and there are many ways we can access them.
% Colours in LaTeX are provided by the xcolor pacakge that loads by default. However, the xcolor package by itself does not provide enough breadth in colours.


% More colours can be called by using the "dvipsnames" options while calling beamer in the preamble of the document, e.g., \documentclass[xolor = dvipsnames]{beamer}



% Other than that we can also blend differnt colours to achive the desired colour mix or simply use the RGB codes to call that particular color.


% For blending two colours, we need to specify the two colours (Duh-uh!) and the percentage share of the two colours in the folowing format: <color1>!<percentage of color1>!<color2>
% If percentage of color1 is specified as x%, then percentage of color2 will automatically be taken as (100 - n)%.




% Why don't we try out a few options and see for ourselves.




% Here we are defining only two colours. We are primarily only going to use the first one.
\definecolor{Ftitle}{rgb}{0, 0, 0} % (rgb - 0, 0, 0) is nothing but black
% Here, we are using "rgb" in small case and this notation for decimal values of "rgb" ranging from 0 to 1

% To specify the integer values of "RGB", ranging from 0 t0 255, we need to use the "RGB" in CAPS or UPPERCASE
% Also, the first curly braces include the name that we assign to the colour combination
\definecolor{Descitem}{RGB}{0, 0, 139}

\definecolor{StdTitle}{RGB}{26, 33, 141}
\definecolor{StdBody}{RGB}{213,24,0}

\definecolor{AlTitle}{RGB}{255, 190, 190}
\definecolor{AlBody}{RGB}{213,24,0}

\definecolor{ExTitle}{RGB}{201, 217, 217}
\definecolor{ExBody}{RGB}{213,24,0}




% Another color for the background canvas using the blending option
%\definecolor{BgShade}{red!30!white}
%%% Important note: While trying this, I found out that a colour cannot be defined this way, it can only be set or called for a particular feature using the \setbeamercolor{}{} command. We will use this below to show this.


%%%%%%
% Assign colours to different constitutens of the presentation as per the requriements.
%%%%%%



% This sets the colour of the title of the presentation and titles of all the slides in the presentation to black.
\setbeamercolor{frametitle}{fg = Ftitle}
\setbeamercolor{title}{fg = Ftitle}

% In case you choose to display the Table of Contents, or the Outline slide.
\setbeamercolor{section in toc}{fg = Ftitle}
\setbeamercolor{section in toc shaded}{fg = Ftitle}

% The colour of all the items, subitems and and subsubitems are set to black.
\setbeamercolor{item}{fg = Ftitle}
\setbeamercolor{subitem}{fg = Ftitle}
\setbeamercolor{subsubitem}{fg = Ftitle}

% This sets the color for each item heading of the description environment.
\setbeamercolor{description item}{fg = Descitem}

% NOTE: Setting the color black for all the items also sets in black for other environemnts like enumerate.

% We also need to fix the colours for captions for figures and tables.
\setbeamercolor{caption}{fg = Ftitle}
\setbeamercolor{caption name}{fg = Ftitle}

% In addition, we can also change the background colour of the slides depending on pur requirement.
% \setbeamercolor{background canvas}{bg = blue!5}
% We have commented out this command because this is just for illustrative purposes and has not been used to define the background colour of the slides.




%%%%%%
% Now, there are three types of boxes in beamer:
% 1. Simple, or standard block, which can be invoked using definition or theorem
% 2. Alert block
% 3. Example block
% We will customize all these blocks based on our requirements


% Standard block
\setbeamercolor{block title}{fg = Descitem, bg = StdTitle!15!white}
\setbeamercolor{block body}{bg = StdBody!5!white}

% Alert block
\setbeamercolor{block title alerted}{bg = AlTitle}
\setbeamercolor{block body alerted}{bg = AlBody!5!white}

% Example block
\setbeamercolor{block title example}{bg = ExTitle}
\setbeamercolor{block body example}{bg = ExBody!5!white}



%%%%%%
% And one final thing, the colour of the text
\setbeamercolor{normal text}{fg = Ftitle}






%%%%%%%%%%%%%%
%%
%% Font theme
%%
%%%%%%%%%%%%%%


%%%%%%
% Here we are using default fonts
\usefonttheme{professionalfonts}

% Font for the presentation title
\setbeamerfont{title}{size = \huge}

% Font of the frame titles
\setbeamerfont{frametitle}{size = \Large}


%%%%%%%%%%%%%%
%%
%% Inner theme
%%
%%%%%%%%%%%%%%


%%%%%%
% Here we am using the rounded theme for the overall "feel" of the presentation. You can change the specific details by editing that particular option as we have done below.
\useinnertheme{rounded}

% Instead of rounded circles, we will use triangles as the indicator for items.
\setbeamertemplate{itemize items}[triangle]

% The default option for enumerate environment removes the circles around the numbers provided by the "rounded" inner theme. Just simple numbers remain.
%\setbeamertemplate{enumerate items}[default]


%%%%%%%%%%%%%%
%%
%% Outer theme
%%
%%%%%%%%%%%%%%


%%%%%%
% The outer theme takes the most amount of effort and time to customize.


%%%%%%
% In the outer theme, we will try to do the following:
% 1. Change the headline by putting a logo and a horizontal line
% 2. Change the footline and include custom information depending on our requirements
% 3. Organize the presentation title and the frame titles


%%%%%%
% Let's start with the headline. The approach that we plan to take for the headline and footline is similar.
% We will first define a new command and then include the command in the \setbeamertemplate{} option.
% I tried a couple of approaches that would make the method more simple but could not come up with one. % In case you do find a more aesthetic approach, please do send it accross. The contact information is on the top of the page.
% First the horizontal line on the top portion of the slides
% Add a horizontal line that runs from left of the slide to the right, just below the logo.
\newcommand{\LogoLine}{%
\raisebox{-12mm}[0pt][0pt]{%
\begin{pgfpicture}{0mm}{0mm}{0mm}{0mm}
\pgfsetlinewidth{0.28mm}
\color{gray}
\pgfline{\pgfpoint{-3mm}{1mm}}{\pgfpoint{10.8cm}{1mm}}
\end{pgfpicture}}}


% Include the line that we just created in the headline
\setbeamertemplate{headline}[text line]{\LogoLine}


% Now the logo. As it turns out. I could not include the logo in the headline. If I tried to, the headline kept shifting downwards.
% Acting a little smart and lazy, I just included the logo in the right sidebar and shifted it up.
\setbeamertemplate{sidebar canvas right}{
\vspace*{3pt}\hspace*{-25pt}%
{\includegraphics[height=28pt]{moo.png}}}





%%%%%
% Now that we have changed the headline, we will need to orient the frame titles in a way that the come at the right stop just above the horizontal line.
\setbeamertemplate{frametitle}{
\vspace*{4mm}\hspace*{-2mm}\insertframetitle}


%%%%%
% Like mentioned above, we will take a similar approach to customize the footline as well and inclued FAA in it.
\newcommand{\Ffootline}{%
\insertsection % The left end of the footline
\hfill
\textit{Moo} % The center
\hfill
\insertframenumber/\inserttotalframenumber} % And the right end



\setbeamertemplate{footline}{%
\usebeamerfont{structure}
\begin{beamercolorbox}[wd=\paperwidth,ht=2.25ex,dp=1ex]{title in head/foot}%
\Tiny\hspace*{4mm} \Ffootline \hspace{4mm}
\end{beamercolorbox}}
%%%%%%
% We will also remove the navigation symbols, which I personally don't find very useful
\setbeamertemplate{navigation symbols}{}
%%%%%%
% Now the toughest part--at least for me--customizing the title page.
% Putting a logo on the title page and text beside it was quite a difficult task and to be fairly honest, my code is not effecient at all. At the very least, it is plain clumsy.
% Though it does solve the purpose (I hate to use this phrase) it is neither "neat" nor "cool".
% Anyway, let's see how we went about it.
% For the title page, we needed a logo on the left, a vertical separater line, and finally a place for the title, author, date etc.



% First, let's create the line
\newcommand{\TitleLine}{%
\raisebox{-12mm}[0pt][0pt]{%
\begin{pgfpicture}{0mm}{0mm}{0mm}{0mm}
\pgfsetlinewidth{0.10mm}
\color{gray}
\pgfline{\pgfpoint{55mm}{0mm}}{\pgfpoint{55mm}{50mm}}
\end{pgfpicture}}}



% Now let's create commands for the title etc., that we can call later

% Title
\newcommand{\MyTitle}{%
\hspace*{60mm}\vspace{-25mm}
\centering \inserttitle}

% Subtitle
\newcommand{\MySubTitle}{%
\hspace*{60mm}\vspace{-25mm}
\centering \footnotesize \textit{\insertsubtitle}}

% Author
\newcommand{\MyAuthor}{
\hspace*{60mm}\vspace{-25mm}
\centering \insertauthor}

% Institute
\newcommand{\MyInstitute}{
\hspace*{60mm}\vspace{-25mm}
\centering \footnotesize \textit{\insertinstitute}}

% Date
\newcommand{\MyDate}{
\hspace*{60mm}\vspace{-25mm}
\centering \insertdate}



% We declare the image that will be used as the logo
\pgfdeclareimage[width = 0.20\paperwidth]{big}{moo.png}



% This is quite a complicated command. We basically create a "beamercolorbox" for each field and invoke the commands that we had created earlier.
\setbeamertemplate{title page}{\TitleLine
\hspace*{11mm}\vspace*{-60mm}
\begin{beamercolorbox}[wd=0.5\paperwidth,ht=0.13\paperwidth]{Title}
\pgfuseimage{big}
\end{beamercolorbox}
%
\begin{beamercolorbox}[wd=\paperwidth,ht=0.06\paperwidth]{Title}
\usebeamerfont{Title}%
\MyTitle
\end{beamercolorbox}
%
\begin{beamercolorbox}[wd=\paperwidth,ht=0.03\paperwidth]{Title}
\usebeamerfont{Title}%
\MySubTitle
\end{beamercolorbox}
%
\begin{beamercolorbox}[wd=\paperwidth,ht=0.06\paperwidth]{Title}
\usebeamerfont{Title}%
\MyAuthor
\end{beamercolorbox}
%
\begin{beamercolorbox}[wd=\paperwidth,ht=0.03\paperwidth]{Title}
\usebeamerfont{head/foot}%
\MyInstitute
\end{beamercolorbox}
%
\begin{beamercolorbox}[wd=\paperwidth,ht=0.07\paperwidth]{Title}
\usebeamerfont{Title}%
\MyDate
\end{beamercolorbox}}


\mode
<all>

Well, this pretty much completes the creation of Moo. I will upload the Sty file, TeX file and sample pdf for direct use and references. 

Also, in case you are trying to create a more complicated theme you should definitely check out some of the resources mentioned below.
  1. Most important - The Beamer user guide
  2. A great repository of themes here
  3. A great introduction to Beamer here
  4. Some information that helped
  5. Another custom theme here
  6. A very good Beamer example
Hope this information helps.

The uploaded file

Style file

TeX File

PDF output

19 comments:

  1. Great timing! I was just wondering about how to do this. Definitely interested in grabbing the files, once they are posted!

    ReplyDelete
  2. Awesome, I have been looking for something like this for a while now, thanks!

    ReplyDelete
  3. Very helpful in porting over a ppt template to something much more useful!

    Thanks

    ReplyDelete
  4. Very Helpful, but I don't understand the last step at all :s

    ReplyDelete
    Replies
    1. It took me a while to get my head around it too. Try making your own template by tweaking the options. If you still find it obscure, I'll try to explain :)

      Delete
  5. i tried to change the logo line width, but change the number in the line "\pgfsetlinewidth{0.28mm}" didn't seem to take any effect. any idea?

    ReplyDelete
  6. Your links to style file and pdf output are swapped!

    ReplyDelete
  7. Really nice explanation!
    But did you know if it's possible to design the indicator for items. I mean, in your example you specified triangle.
    I'm looking for custom the color of items indicators. Do you know if it's possible ?

    ReplyDelete
    Replies
    1. Thanks Greg.

      I am pretty sure it is possible. However, it's been a while since I used TeX and hence my knowledge is a bit rusty. Let me try and see if I can find a way to do it.

      Delete
  8. hi! is it possible to change the logo on the title slide (first one) ? keeping it in the same position and taking away the line, just for the first slide... for the other ones I managed to use your system, thank you!
    giulia

    ReplyDelete
  9. I really dont have any idea how to install a new beamer template on Mac, any idea?

    ReplyDelete
  10. the link you gave for the files are not working

    ReplyDelete
  11. Something very similar transpires when you make a low quality and amateurish logo for your business. Your items and administrations will never be viewed as quality items.logo design service

    ReplyDelete
  12. I was surfing net and luckily ran over this site and discovered exceptionally intriguing stuff here. Its truly enjoyable to peruse. I delighted in a considerable measure. A debt of gratitude is in order for sharing this superb data.
    If you want to learn more: Beamer leihen

    ReplyDelete
  13. I'm 10 years too late to see this. Very interesting and clear explanation, it's a pity that the Dropbox links are down and it's no possible to see the files that accompanied this post anymore. I wish they could be made available again.

    ReplyDelete
  14. This is very interesting. thanks for that. we need more sites like this. i commend you on your great content and excellent topic choices. international certificate of good health form 77 043 I wanted to thank you for this great read. I definitely enjoying every little bit of it I have you bookmarked to check out new stuff you post.

    ReplyDelete
  15. Excellent post!
    Thanks!!
    Is it possible that a new file "beamerthemeNEW.sty" is not found in the same folder where the rest of the beamer templates are?

    ReplyDelete
  16. Консоли от компании Microsoft не сразу завоевали всемирную популярность и доверие игроков. 1-ая консоль под названием Xbox, вышедшая в далеком 2001 году, значительно уступала PlayStation 2 по количеству проданных приставок. Но все изменилось с выходом Xbox 360 - консоли седьмого поколения, которая стала по-настоящему "народной" для жителей России и стран СНГ - Xbox 360 прошивка FreeBoot. Портал Ru-Xbox.Ru является популярным ресурсом среди поклонников приставки, поскольку он предлагает игры для Xbox 360, которые поддерживают все имеющиеся версии прошивок - совсем бесплатно! Для чего играть на оригинальном железе, в случае если есть эмуляторы? Для Xbox 360 игры выходили долгое время и находятся как посредственными проектами, так и хитами, многие из которых даже сейчас остаются уникальными для это консоли. Некие пользователи, желающие сыграть в игры для Xbox 360, могут задать вопрос: для чего необходимы игры для прошитых Xbox 360 freeboot или разными версиями LT, если имеется эмулятор? Рабочий эмулятор Xbox 360 хоть и существует, однако он требует производительного ПК, для покупки которого потребуется вложить существенную сумму. К тому же, различные артефакты в виде исчезающих текстур, отсутствия некоторых графических эффектов и освещения - могут значительно испортить впечатления об игре и отбить желание для ее дальнейшего прохождения. Что предлагает этот веб-сайт? Наш сайт полностью посвящен играм для приставки Xbox 360. У нас вы можете совершенно бесплатно и без регистрации скачать игры на Xbox 360 через torrent для следующих версий прошивок консоли: - FreeBoot; - LT 3.0; - LT 2.0; - LT 1.9. Каждая прошивка имеет свои особенности обхода встроенной защиты. Потому, для запуска той либо прочей игры потребуется загрузить специальную ее версию, которая стопроцентно приспособлена под одну из четырех перечисленных выше прошивок. На нашем интернет-сайте вы можете без труда найти желаемый проект под подходящую прошивку, поскольку возле каждой игры присутствует заглавие версии (FreeBoot, LT 3.0/2.0/1.9), под которую она приспособлена. Пользователям данного ресурса доступна особая категория игр для 360-го, созданных для Kinect - специального дополнения, которое считывает все движения одного либо нескольких игроков, и позволяет управлять с их помощью компьютерными персонажами. Большой выбор ПО Не считая способности загрузить игры на Xbox 360 Freeboot или LT разных версий, тут вы можете найти программное обеспечение для консоли от Майкрософт: - разнообразные версии Dashboard, которые позволяют кастомизировать интерфейс консоли под свои нужды, сделав его более комфортным и современным; - браузеры; - просмотрщики файлов; - сохранения для игр; - темы для консоли; - программы, для конвертации образов и записи их на диск. Кроме перечисленного выше игры на Xbox 360 Freeboot вы можете запускать не с дисковых, а с USB и прочих носителей, используя программу x360key, которую вы можете достать на нашем веб-сайте. Гостям доступно огромное количество полезных статей, а также форум, где вы можете пообщаться с единомышленниками или попросить совета у более опытных хозяев консоли.

    ReplyDelete