# Converting cpg1.2.x themes to cpg1.3.3

To make your custom made theme from cpg1.2.0 work with cpg1.3.3, you'll have to change some places.
Remember to back up your original files, so you can go back to a working version in case something goes wrong with the modifications.

1. Create a new css class for the properties of the html around the intermediate sized pic (visible in displayimage.php):
   Edit style.css and find

       .image {
               border-style: solid;
               border-width:1px;
               border-color: #000000;
               margin: 2px;
       }

   Add after it

       .imageborder {
               border: 1px solid #000000;
               background-color: #FFFFFF;
               margin-top: 30px;
               margin-bottom: 30px;
       }

2. Create a new css class for the debug output:
   Edit style.css, go to the very end of the file and add this code:

       .debug_text {
               border: #BDBEBD;
               background-color: #EFEFEF;
               width : 100%;
               margin : 0px;
       }

3. Create a new css class for the clickable options in the config:
   Edit style.css, go to the very end of the file and add this code:

       .clickable_option {
               border-bottom : 1px dotted blue;
               cursor : hand;
       }

4. Create a new css class for the dropdown boxes for theme and language selection:
   Edit style.css, go to the very end of the file and add this code:

       .listbox_lang {
               color: #000000;
               background-color: #D1D7DC;
               border: 1px solid #D1D7DC;
               font-size: 80%;
               font-family: Arial, Helvetica, sans-serif;
               vertical-align : middle;
       }

5. Choose a place where the language and theme selection should be located on your coppermine pages. It's recommended to do this even if you're not planning to actually use the language and theme selection options, since they can be enable/disabled at any time in Coppermine config:
   Edit template.html and find a place anywhere between `<body>` and `</body>` where you want the selectors to appear. Add `{LANGUAGE_SELECT_LIST}` for the language selection dropdown, `{LANGUAGE_SELECT_FLAGS}` for the language-by-flag selector and `{THEME_SELECT_LIST}` for the theme selection dropdown.
6. Make the header information of your local file match the version you have updated to.
   Edit theme.php and find

       // Coppermine Photo Gallery 1.2.0                                            //

   and change it to

       // Coppermine Photo Gallery 1.3.3                                            //

7. Find a place where the memberlist list should appear in your coppermine navigation. It's recommended to do this even if you're not planning to actually use the feature, since it can be enable/disabled at any time in Coppermine config.
   Edit theme.php and find

       <!-- END my_gallery -->

   and add after it

       <!-- BEGIN allow_memberlist -->
                       <a href="{MEMBERLIST_TGT}" title="{MEMBERLIST_TITLE}">{MEMBERLIST_LNK}</a>  ::
       <!-- END allow_memberlist -->

   . You may have to adopt the html that is usually wrapped around your menu items for the memberlist menu item as well.
8. Find a place where the user FAQ should appear in your coppermine navigation. It's recommended to do this even if you're not planning to actually use the feature, since it can be enable/disabled at any time in Coppermine config.
   Edit theme.php and find

       <!-- END my_profile -->

   and add after it

       <!-- BEGIN faq -->
                           <a href="{FAQ_TGT}" title="{FAQ_TITLE}">{FAQ_LNK}</a> ::
       <!-- END faq -->

   . You may have to adopt the html that is usually wrapped around your menu items for the user faq menu item as well.
9. Find a place where the Ecards-Log should appear in your admin menu.
   Edit theme.php and find

       <td class="admin_menu"><a href="banning.php" title="">{BAN_LNK}</a></td>

   Add after it

       <td class="admin_menu"><a href="db_ecard.php" title="">{DB_ECARD_LNK}</a></td>

10. Add clickable album feature:
    Edit theme.php and find

        <b>{ALBUM_TITLE}</b>

    . Replace it with

        <a href="{ALB_LINK_TGT}" class="alblink"><b>{ALBUM_TITLE}</b></a>

    (This code is twice in theme.php, so you will have to replace it two times).
11. Correct the missing link to tile.gif in the fimstrip display:
    Edit theme.php and find

        <td valign="top" background='themes/igames/images/tile.gif' align="center" height='30'>&nbsp;</td>

    .
    Replace `igames` in this line with the name of your theme. This line exists twice in your theme.php - you'll have to change both times the reference from `igames` to `your_theme`.
12. Copy the file tile.gif from any theme that comes with coppermine (e.g. themes/default/images/tile.gif) into them images-folder of your own custom theme (e.g. themes/your_theme/images/)
13. Add the Downloadable favorites option:
    Edit theme.php and find

        // HTML template for thumbnails display

    and add before it

        // HTML template for title row of the fav thumbnail view (album title + download)
        $template_fav_thumb_view_title_row = <<<EOT

                                <table width="100%" cellpadding="0" cellspacing="0">
                                <tr>
                                        <td width="100%" class="statlink"><h2>{ALBUM_NAME}</h2></td>
                                        <td><img src="images/spacer.gif" width="1"></td>
                                        <td class="sortorder_cell">
                                                <table height="100%" cellpadding="0" cellspacing="0">
                                                        <tr>
                                                                <td class="sortorder_options"><span class="statlink"><a href="zipdownload.php">{DOWNLOAD_ZIP}</a></span></td>
                                                        </tr>
                                                        </table>
                                        </td>
                                </tr>
                                </table>

        EOT;

    Make sure there are no spaces in front of or after the `EOT;` in the last line.
14. Replace hardcoded format of intermediate pic with css format:
    Edit theme.php and find

                  <table cellspacing="2" cellpadding="0" style="border: 1px solid #000000; background-color: #FFFFFF; margin-top: 30px; margin-bottom: 30px;">
                                        <tr>
                                                <td>

    and replace with

                                <table cellspacing="2" cellpadding="0" class="imageborder">
                                        <tr>
                                                <td align="center">

15. Move debug output from theme to functions:
    Edit theme.php and find

            if ($CONFIG['debug_mode']) {
                $time_end = getmicrotime();
                $time = round($time_end - $time_start, 3);

                $query_count = count($query_stats);
                $query_times = '';
                $total_query_time = 0;
                foreach ($query_stats as $qtime) {
                    $query_times .= round($qtime, 3) . "s ";
                    $total_query_time += $qtime;
                }
                $total_query_time = round($total_query_time, 3);

                starttable('100%', 'Debug info');
                echo "<tr><td class=\"tableb\">";
                echo "USER: <pre>";
                print_r($USER);
                echo "</pre></td></tr><td class=\"tableb\">";
                echo "<tr><td class=\"tableb\">";
                echo "USER DATA: <pre>";
                print_r($USER_DATA);
                echo "</pre></td></tr><td class=\"tableb\">";
                echo "<tr><td class=\"tableb\">";
                echo "Queries: <pre>";
                print_r($queries);
                echo "</pre></td></tr><td class=\"tableb\">";
                echo "GET :<pre>";
                print_r($HTTP_GET_VARS);
                echo "</pre></td></tr><td class=\"tableb\">";
                echo "POST :<pre>";
                print_r($HTTP_POST_VARS);
                echo "</pre></td></tr><td class=\"tableb\" >";
                echo <<<EOT
                        Page generated in <b>$time</b> seconds - <b>$query_count</b> queries in <b>$total_query_time</b> seconds - Album set : $ALBUM_SET
        EOT;
                echo "</td></tr>";
                echo "<tr><td class=\"tableb\">";
                echo "<a href=\"phpinfo.php\">Advanced debug mode</a> (phpinfo)";
                echo "</td></tr>";
                endtable();
            }

    and replace with

            if ($CONFIG['debug_mode']==1 || ($CONFIG['debug_mode']==2 && GALLERY_ADMIN_MODE)) {
            cpg_debug_output();
            }

16. Add switches for memberlist and faq:
    Edit theme.php and find

            if (USER_ID || !$CONFIG['allow_user_registration']) {
                template_extract_block($template_main_menu, 'register');
            }

    and add after it

            if (!USER_ID || !$CONFIG['allow_memberlist']) {
                template_extract_block($template_main_menu, 'allow_memberlist');
            }

            if (!$CONFIG['display_faq']) {
                template_extract_block($template_main_menu, 'faq');
            }

17. Enable new coppermine menu entries:
    Edit theme.php and find

                '{MY_GAL_LNK}' => $lang_main_menu['my_gal_lnk'],

    and add after it

                '{MEMBERLIST_TGT}' => "usermgr.php",
                '{MEMBERLIST_TITLE}' => $lang_main_menu['memberlist_title'],
                '{MEMBERLIST_LNK}' => $lang_main_menu['memberlist_lnk'],
                '{FAQ_TGT}' => "faq.php",
                '{FAQ_TITLE}' => $lang_main_menu['faq_title'],
                '{FAQ_LNK}' => $lang_main_menu['faq_lnk'],

18. Enable new admin menu entries:

                    '{BAN_LNK}' => $lang_gallery_admin_menu['ban_lnk'],

    and add after it

                    '{DB_ECARD_LNK}' => $lang_gallery_admin_menu['db_ecard_lnk'],

19. Enable category thumbnail:
    Edit theme.php and find

            $template_noabl = template_extract_block($template_cat_list, 'catrow_noalb');
            $template = template_extract_block($template_cat_list, 'catrow');
            foreach($cat_data as $category) {
                if (count($category) == 2) {
                    $params = array('{CAT_TITLE}' => $category[0],
                        '{CAT_DESC}' => $category[1]
                        );
                    echo template_eval($template_noabl, $params);
                } elseif (isset($category['cat_albums']) && ($category['cat_albums'] != '')) {
                    $params = array('{CAT_TITLE}' => $category[0],
                        '{CAT_DESC}' => $category[1],
                        '{CAT_ALBUMS}' => $category['cat_albums'],
                        '{ALB_COUNT}' => $category[2],
                        '{PIC_COUNT}' => $category[3],
                        );
                    echo template_eval($template, $params);
                } else {
                    $params = array('{CAT_TITLE}' => $category[0],
                        '{CAT_DESC}' => $category[1],
                        '{CAT_ALBUMS}' => '',
                        '{ALB_COUNT}' => $category[2],
                        '{PIC_COUNT}' => $category[3],
                        );
                    echo template_eval($template, $params);
                }
            }

    and replace with

            $template_noabl = template_extract_block($template_cat_list, 'catrow_noalb');
            $template = template_extract_block($template_cat_list, 'catrow');
            foreach($cat_data as $category) {
                if (count($category) == 3) {
                    $params = array('{CAT_TITLE}' => $category[0],
                            '{CAT_THUMB}' => $category['cat_thumb'],
                        '{CAT_DESC}' => $category[1]
                        );
                    echo template_eval($template_noabl, $params);
                } elseif (isset($category['cat_albums']) && ($category['cat_albums'] != '')) {
                    $params = array('{CAT_TITLE}' => $category[0],
                        '{CAT_THUMB}' => $category['cat_thumb'],
                        '{CAT_DESC}' => $category[1],
                        '{CAT_ALBUMS}' => $category['cat_albums'],
                        '{ALB_COUNT}' => $category[2],
                        '{PIC_COUNT}' => $category[3],
                        );
                    echo template_eval($template, $params);
                } else {
                    $params = array('{CAT_TITLE}' => $category[0],
                        '{CAT_THUMB}' => $category['cat_thumb'],
                        '{CAT_DESC}' => $category[1],
                        '{CAT_ALBUMS}' => '',
                        '{ALB_COUNT}' => $category[2],
                        '{PIC_COUNT}' => $category[3],
                        );
                    echo template_eval($template, $params);
                }
            }

20. Enable favorites - global settings:
    Edit theme.php and find

            global $template_thumb_view_title_row, $lang_thumb_view, $template_tab_display, $template_thumbnail_view;

    and replace with

            global $template_thumb_view_title_row,$template_fav_thumb_view_title_row, $lang_thumb_view, $template_tab_display, $template_thumbnail_view;

21. Enable favorites - switch:
    Edit theme.php and find

            $tabs_html = $display_tabs ? create_tabs($nbThumb, $page, $total_pages, $theme_thumb_tab_tmpl) : '';
            // The sort order options are not available for meta albums
            if ($sort_options) {
                $param = array('{ALBUM_NAME}' => $album_name,
                    '{AID}' => $aid,
                    '{PAGE}' => $page,
                    '{NAME}' => $lang_thumb_view['name'],
                    '{TITLE}' => $lang_thumb_view['title'],
                    '{DATE}' => $lang_thumb_view['date'],
                    '{SORT_TA}' => $lang_thumb_view['sort_ta'],
                    '{SORT_TD}' => $lang_thumb_view['sort_td'],
                    '{SORT_NA}' => $lang_thumb_view['sort_na'],
                    '{SORT_ND}' => $lang_thumb_view['sort_nd'],
                    '{SORT_DA}' => $lang_thumb_view['sort_da'],
                    '{SORT_DD}' => $lang_thumb_view['sort_dd'],
                    );
                $title = template_eval($template_thumb_view_title_row, $param);
            } else {
                $title = $album_name;
            }

            if ($mode == 'thumb') {
                starttable('100%', $title, $thumbcols);
            } else {
                starttable('100%');
            }

            echo $header;

    and replace with

            $tabs_html = $display_tabs ? create_tabs($nbThumb, $page, $total_pages, $theme_thumb_tab_tmpl) : '';
            // The sort order options are not available for meta albums
            if ($sort_options) {
                $param = array('{ALBUM_NAME}' => $album_name,
                    '{AID}' => $aid,
                    '{PAGE}' => $page,
                    '{NAME}' => $lang_thumb_view['name'],
                    '{TITLE}' => $lang_thumb_view['title'],
                    '{DATE}' => $lang_thumb_view['date'],
                    '{SORT_TA}' => $lang_thumb_view['sort_ta'],
                    '{SORT_TD}' => $lang_thumb_view['sort_td'],
                    '{SORT_NA}' => $lang_thumb_view['sort_na'],
                    '{SORT_ND}' => $lang_thumb_view['sort_nd'],
                    '{SORT_DA}' => $lang_thumb_view['sort_da'],
                    '{SORT_DD}' => $lang_thumb_view['sort_dd'],
                    );
                $title = template_eval($template_thumb_view_title_row, $param);
            } else if ($aid == 'favpics' && $CONFIG['enable_zipdownload'] == 1) { //Lots of stuff can be added here later
               $param = array('{ALBUM_NAME}' => $album_name,
                                     '{DOWNLOAD_ZIP}'=>$lang_thumb_view['download_zip']
                                       );
               $title = template_eval($template_fav_thumb_view_title_row, $param);
            }else{
                $title = $album_name;
            }

            if ($mode == 'thumb') {
                starttable('100%', $title, $thumbcols);
            } else {
                starttable('100%');
            }

            echo $header;

22. Clean up:
    Edit theme.php and find

            if ((!$template)) {
                $template = $template_film_strip;
                $thumb_cell = template_extract_block($template, 'thumb_cell');
                $empty_cell = template_extract_block($template, 'empty_cell');
                // $spacer = template_extract_block($template, 'spacer');
            }
            // if ($header == '') {}
            $cat_link = is_numeric($aid) ? '' : '&cat=' . $cat;

            $theme_thumb_tab_tmpl = $template_tab_display;

            if ($mode == 'thumb') {
                $theme_thumb_tab_tmpl['left_text'] = strtr($theme_thumb_tab_tmpl['left_text'], array('{LEFT_TEXT}' => $lang_thumb_view['pic_on_page']));
                $theme_thumb_tab_tmpl['inactive_tab'] = strtr($theme_thumb_tab_tmpl['inactive_tab'], array('{LINK}' => 'thumbnails.php?album=' . $aid . $cat_link . '&page=%d'));
            } else {
                $theme_thumb_tab_tmpl['left_text'] = strtr($theme_thumb_tab_tmpl['left_text'], array('{LEFT_TEXT}' => $lang_thumb_view['user_on_page']));
                $theme_thumb_tab_tmpl['inactive_tab'] = strtr($theme_thumb_tab_tmpl['inactive_tab'], array('{LINK}' => 'index.php?cat=' . $cat . '&page=%d'));
            }

    and replace with

            if ((!$template)) {
                $template = $template_film_strip;
                $thumb_cell = template_extract_block($template, 'thumb_cell');
                $empty_cell = template_extract_block($template, 'empty_cell');
            }

            $cat_link = is_numeric($aid) ? '' : '&cat=' . $cat;

23. gain some room for the admin menu to display the additional entries:
    Edit style.css and find

        .admin_menu a {
                color: #000000;
                text-decoration: none;
                display: block;
                position: relative;
                padding-top: 1px;
                padding-bottom: 1px;
                padding-left: 10px;
                padding-right: 10px;
        }

    Replace it with

        .admin_menu a {
                color: #000000;
                text-decoration: none;
                display: block;
                position: relative;
                padding-top: 1px;
                padding-bottom: 1px;
                padding-left: 2px;
                padding-right: 2px;
        }

24. Replace some missing/wrong formating:
    Edit theme.php and find

        <td class="tableh2" colspan="3"><span class="catlink"><b>{CAT_TITLE}</b></span>{CAT_DESC}</td>

    . Replace it with

        <td class="tableh2" colspan="3"><table border=0 ><tr><td>{CAT_THUMB}</td><td><span class="catlink"><b>{CAT_TITLE}</b></span>{CAT_DESC}</td></tr></table></td>

25. Replace some missing/wrong formating:
    Edit theme.php and find

        <td class="tableb"><span class="catlink"><b>{CAT_TITLE}</b></span>{CAT_DESC}</td>

    . Replace it with

        <td class="tableb"><table border=0 ><tr><td>{CAT_THUMB}</td><td><span class="catlink"><b>{CAT_TITLE}</b></span>{CAT_DESC}</td></tr></table></td>

26. Add closing table to fix a bug:
    Edit theme.php and find

        function theme_display_breadcrumb($breadcrumb, &$cat_data)
        {
            /**
             * ** added breadcrumb as a seperate element
             */
            global $template_breadcrumb, $lang_breadcrumb;

            starttable('100%');
            if ($breadcrumb) {
                $template = template_extract_block($template_breadcrumb, 'breadcrumb');
                $params = array('{BREADCRUMB}' => $breadcrumb
                    );
                echo template_eval($template, $params);
            }
        }

    . Replace it with

        function theme_display_breadcrumb($breadcrumb, &$cat_data)
        {
            /**
             * ** added breadcrumb as a seperate element
             */
            global $template_breadcrumb, $lang_breadcrumb;

            starttable('100%');
            if ($breadcrumb) {
                $template = template_extract_block($template_breadcrumb, 'breadcrumb');
                $params = array('{BREADCRUMB}' => $breadcrumb
                    );
                echo template_eval($template, $params);
            }
            endtable();
        }

Save all your open files and upload them to your webserver; test-drive both as admin and as "regular" user.