# Custom lists conversion to html

I have managed to produce a latex file that works perfectly and I would like the same functionality using tex4ht on the same file.

Basically, I have several custom \item label that I use to provide custom formatting for both bullet icon and the content following regardless of the level at which they are placed. If it is a numbered list, the number will be dependant upon the level but not the formatting. The following code detects whether or not the environment is itemize or enumerate. Then it provides the appropriate formatting.

\documentclass{article}
\begin{document}
\begin{itemize}
\items This is items
\itemi This is itemi
\end{itemize}
\begin{enumerate}
\items This is items
\itemi This is itemi
\end{enumerate}
\end{document}


In my preamble, I have the following:

\makeatletter
\def\specialenvironment{itemize}
\def\formatitems{\color{Black}\,}
\def\items{%
\ifx\@currenvir\specialenvironment
\item[\normalfont{}{\color{Black}\textbullet}]
\else
\expandafter\let\expandafter\originallabel\csname labelenum\romannumeral\@enumdepth\endcsname
\expandafter\def\csname labelenum\romannumeral\@enumdepth\expandafter\endcsname\expandafter{%
\expandafter\formatitems\originallabel}%
\item
\expandafter\let\csname labelenum\romannumeral\@enumdepth\endcsname\originallabel
\fi
\color{Black}
}
\def\formatitemi{\color{OliveGreen}\,}
\def\itemi{%
\ifx\@currenvir\specialenvironment
\item[\normalfont{}{\color{OliveGreen}\textit{{i}}}]
\else
\expandafter\let\expandafter\originallabel\csname labelenum\romannumeral\@enumdepth\endcsname
\expandafter\def\csname labelenum\romannumeral\@enumdepth\expandafter\endcsname\expandafter{%
\expandafter\formatitemi\originallabel}%
\item
\expandafter\let\csname labelenum\romannumeral\@enumdepth\endcsname\originallabel
\fi
\color{OliveGreen}
}
\makeatother


This runs without error in tex4ht but does not provide the appropriate formatting. I have tried using the \ConfigureEnv, \ConfigureList and \NewConfigure commands in my tex4ht config file but without any success.

Can anyone point me in the right direction?

In your case, you want to customize item labels and color. By default, tex4ht removes itemize and enumerate labels and uses CSS to display them, we can use \ConfigureList to fix that, together with some CSS to suppress labels added by the browser. We can also use \ConfigureList to add class attributes on li elements, so we can assign colors for them.

First of all, move definitions of your macros to standalone package, items.sty:

\ProvidesPackage{items}
\RequirePackage{xcolor}

\definecolor{Black}{rgb}{0,0,0}
\definecolor{OliveGreen}{rgb}{0.3,0.4,0.2}
\def\specialenvironment{itemize}
\def\formatitems{\color{Black}\,}
\def\items{%
\ifx\@currenvir\specialenvironment
\item[\normalfont{}{\color{Black}\textbullet}]
\else
\expandafter\let\expandafter\originallabel\csname labelenum\romannumeral\@enumdepth\endcsname
\expandafter\def\csname labelenum\romannumeral\@enumdepth\expandafter\endcsname\expandafter{%
\expandafter\formatitems\originallabel}%
\item
\expandafter\let\csname labelenum\romannumeral\@enumdepth\endcsname\originallabel
\fi
\color{Black}
}
\def\formatitemi{\color{OliveGreen}\,}
\def\itemi{%
\ifx\@currenvir\specialenvironment
\item[\normalfont{}{\color{OliveGreen}\textit{{i}}}]
\else
\expandafter\let\expandafter\originallabel\csname labelenum\romannumeral\@enumdepth\endcsname
\expandafter\def\csname labelenum\romannumeral\@enumdepth\expandafter\endcsname\expandafter{%
\expandafter\formatitemi\originallabel}%
\item
\expandafter\let\csname labelenum\romannumeral\@enumdepth\endcsname\originallabel
\fi
\color{OliveGreen}
}
\endinput


and configuration file for tex4ht, items.4ht:

\def\ItemsType{items}
\newcommand\ConfigureMyList[2]{%
\ConfigureList{#1}
{\ifvmode\IgnorePar\fi\EndP\HCode{<#2 class="#1">\Hnewline}\ShowPar%
\bgroup
\def\EndDefItem{}
}
{\EndDefItem\egroup%
\ifvmode\IgnorePar\fi\EndP\HCode{</#2>\Hnewline}\ShowPar%
\par}{\EndDefItem\HCode{<li class="\ItemsType" >}\def\EndDefItem{\HCode{</li>\Hnewline}}}{}
}

\ConfigureMyList{itemize}{ul}
\ConfigureMyList{enumerate}{ol}

\newcommand\ConfigureMyItems[2]{%
\pend:def#1{\def\ItemsType{#2}}%
}

\ConfigureMyItems\items{items}
\ConfigureMyItems\itemi{itemi}

\Css{ul, ol{list-style-type: none;}}

\newcommand\tsf@getColor[1][.]{
% colorname . holds current color
\extractcolorspec{#1} {\tsf@color}
\expandafter\convertcolorspec\tsf@color{HTML}\tsf@color
}

\newcommand\MyItemColor[2]{%
\tsf@getColor[#2]%
\Css{.#1{color:\#\tsf@color;}}
}

\MyItemColor{items}{Black}
\MyItemColor{itemi}{OliveGreen}


we've defined some commands, in order to simplify the configuration. With \ConfigureMyList, you configure an environment #1 to use list element #2. Environments supported by default are:

\ConfigureMyList{itemize}{ul}
\ConfigureMyList{enumerate}{ol}


you can add any other list environment,

interesting part of our \ConfigureList is:

{\EndDefItem\HCode{<li class="\ItemsType" >}\def\EndDefItem{\HCode{</li>\Hnewline}}}


ItemsType must be defined in \items and \itemi and it must expand to the class name, which will be used to assign the color. Also note that default configurations for enumerate and itemize use \DeleteMark at the end of third parameter for \ConfigureList, so LaTeX label is deleted and CSS is used instead to generate the label.

Css generated labels are disabled with:

\Css{ul, ol{list-style-type: none;}}


We need to insert definition of \ItemsType to our custom \item macros. To simplify the process, we can create a helper macro:

\newcommand\ConfigureMyItems[2]{%
\pend:def#1{\def\ItemsType{#2}}%
}


the \ConfigureMyItems command will insert the definition at the beginning of the redefined command:

\ConfigureMyItems\items{items}
\ConfigureMyItems\itemi{itemi}


class names are now accessible from our list configuration. We have only to declare colors used for the classes:

\MyItemColor{items}{Black}
\MyItemColor{itemi}{OliveGreen}


The result:

• Just for the record, this works perfectly and has solved my problem. Thank you so much. – Jonathan Gayton Nov 14 '15 at 13:52