Need help customizing gallery to seamlessly look like existing site

[eventide]

Hello, all.

This is my first time using Coppermine.

I'm working on an existing site: KoKos Pet Spa and need to add the Coppermine Photo Gallery as an additional page to the site. I need the photo gallery to just be seamlessly embedded within the structure of the existing site so it looks like every other page in regards to the header and top and side nav menus. I use php includes to build the header image and nav bar, and the side navigation on all pages but the home page. There is a 600px wide container div that each of the pages' contents go in - everything else on the site is generated by the php includes. So I just need the gallery in that 600px container div (and the admin stuff too).

So, my thinking was to build a gallery page like the rest of the site (menus and header includes) and in the page's container div, simply inlcude a customzied template.html (I really only NEED the admin and gallery "tokens": {} as far as I can tell.) But I quickly realized that won't work and I really can't figure out how to go about doing this.

I'd really appreciate it if someone could help me out here!

I understand that I may not have provided enough information, so let me know if you need more info to help me out.

Thanks in advance.

Mark

[Jeff Bailey]

You might have to pay someone to to this but all you really have to do is cut and paste everything from your includes ... minus the php code ... into the template.html file while wrapping the gallery in your div container. The open div tag would go before {CUSTOM HEADER} and the closing would go after the {CUSTOM FOOTER} or {VANITY} tag. You will have to adjust widths to make it all work. Or you can use the actual custom header and footer options on your admin config/Themes settings (read up on how to use those here).
Your best bet is to read the docs on making custom themes http://coppermine-gallery.net/demo/cpg14x/docs/index.htm#creating

edit - There is no real way to help you without you showing all your code. Do not do that here unless someone asks for it.

[eventide]

Thanks for the reply, Jeff.

I better not have to pay someone to do this - I developed the site myself! I'm just at kind of a "novice-to-intermediate" level of php knowledge. I don't mind digging into the code, I just want to make sure what I do doesn't break anything...

Honestly, I did go over the documentation, but I just couldn't figure out what I need to do based on the information given in the documentation. That's why I'm posting here.

Regarding your suggestion of cutting and pasting everything from the includes, you said "The open div tag would go before {CUSTOM HEADER} and the closing would go after the {CUSTOM FOOTER} or {VANITY}". Is that to say that on the existing template.html I can safely delete any content out side of those "tokens" and replace it with my own code?

Also, in the Themes Settings section of the Config options, I don't understand the function of the "Custom menu link name", or  the "Custom menu link URL". Unfortunately the tool tip didn't help me. Could you (or anyone) clarify the function of those for me?

The two options regarding custom header and footer includes apparently aren't an option for me, as my includes (both header and footer) have html and body tags and the tool tip for those two options say those tags can't be in the referenced inlcude file.

Here is the code all of the pages on the Web site use. As you can see, this one is for the "Contact Us" page (I removed the page-specific content). It was my hope that I would be able to simply create a new page for the gallery in the site's root folder with the other pages and then include the template.html file, customized to work within the enclosing "content" divs.

Code Select Expand

<?php $page_title = 'KoKos Pet Spa - Contact Us';
$description = 'Provides information on how to contact KoKos Pet Spa, Inc.';
include("includes/dtd-title-header-menu.html"); ?>

<div id="content">
<?php include("includes/sideMenu.html"); ?>

<div id="mainContent">
<!-- individual page's content goes here -->
</div>
</div> <!-- Close the main content div -->

<?php include("includes/footer.html"); ?>

But it appears, by your suggestion that is not possible. It's really the gallery's index.php file that everything is built on.

I'm sure you can understand that I'd like to avoid having to copy/paste all of the code from each of the include files into the template.html, as updating the site would require making sure the template.html code matched exactly any changes made in the include files. But if that's the only way to accomplish what I need to do, then so be it.

Thanks again, in advance!

[susied]

I too am new to Coppermine Photo Gallery and php. I just made it look like our current pages following the documentation about customization. Instead of using the custom header and custom footer, I just put all my code in my custom template, theme, and css.

I copied one of the existing templates and just started modifying it. You can see my customization here http://www.catconnection.net/contest/cpg1.4.25/cpg14x/index.php

This is not an active link (meaning it is not being referenced anywhere on the core site). I am trying to get it to looking as much like http://www.catconnection.net/PhotoContest.php as I can.

There are just a couple of things that I learned that might be helpful to you. As you can see, we have a Vote for Me button under all the pictures. These have to go to displayimage.php because the ratepic.php has a check in it to be sure the vote is coming from that page.

Everything I have done so far is in the template and the core hasn't been touched.

[eventide]

I copied one of the existing templates and just started modifying it. You can see my customization here http://www.catconnection.net/contest/cpg1.4.25/cpg14x/index.php

Everything I have done so far is in the template and the core hasn't been touched.

That link shows exactly what I want to do!

Some questions on how you accomplished that:

To clarify your last sentance: so, of the Coppermine files and its code, all you have modified is code in just the template.html file?

On the page you provided the link for, where exactly does the Coppermine-specific content start/end? Just above the Coppermine menu links, or is the orange banner included in the template.html file as well?

What code in the template.html file did you delete (if any)?

Are you using any existing php includes you had (such as for the header/navigation section) for anything outside of the gallery and if so, how did you resolve the path references within those includes?

If you didn't/aren't using includes for navigation, etc, I would assume then that you just copy/pasted your existing navigation code to the template.html file...

By the way, ironically, the people I'm doing this gallery for are also using it to run a contest!

[phill104]

For your site is should be really easy. Take a look at this post to see a simplre way to do it and adapt to your needs.

http://forum.coppermine-gallery.net/index.php/topic,45021.msg214394.html#msg214394

[susied]

I looked at what Phil posted and it looks very helpful so I would suggest you do. I went through the documentation which is also very thorough.

That link shows exactly what I want to do!

Some questions on how you accomplished that:

To clarify your last sentance: so, of the Coppermine files and its code, all you have modified is code in just the template.html file?
I copied and modified the template, and css from I think water_drop. Theme I got from the sample. NOTE: The documentation suggests that you NOT take all the sample theme code because it has everything in it. I am shakey with php so I just took it all.

On the page you provided the link for, where exactly does the Coppermine-specific content start/end? Just above the Coppermine menu links, or is the orange banner included in the template.html file as well?

Just below the Contestants banner is where the Coppermine-specific content starts it ends with the "Powered by Coppermine Photo Gallery" right before the bottom banner.

What code in the template.html file did you delete (if any)? {CUSTOM_HEADER} <h1>{GAL_NAME}</h1>
              <h3>{GAL_DESCRIPTION}</h3><br /> {CUSTOM_FOOTER}{VANITY} in the template.
              The formatting of the photos was done in THEMES.
<code><!-- BEGIN thumb_cell -->
        <td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
      <div class="Interior_Contestants">
                <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td align="center">
                         <h1> <div style="text-align:center;width:100%"> {CAPTION} </div></h1><br>
                         <table width="160" border="0" cellspacing="0" cellpadding="0">
                                  <tr bgcolor="#FFFFFF">
                                <td colspan="3"><img src="images/spacer.gif" width="160" height="11" /></td>
                                  </tr>
                                  <tr bgcolor="#FFFFFF">
                               <td rowspan="3"><img src="images/spacer.gif" width="11" height="20" /></td>
                                    <td><a href="{LINK_TGT}">{THUMB}<br /></a>
                                          {ADMIN_MENU}</td>
                               <td rowspan="3"><img src="images/spacer.gif" width="11" height="20" /></td>
                                  </tr>
                                  <tr bgcolor="#FFFFFF">
                                    <td><img src="images/spacer.gif" width="138" height="11" /></td>
                                  </tr>

                                  <tr bgcolor="#FFFFFF">
                          <td valign="center" width="138" height="26">

                                           <a href="{LINK_TGT}">
                                 
                                             <img src="images/Button_Vote.gif" border="0" alt="GREAT" />
                                                                      </a> </td>
                                  </tr>

                                  <tr bgcolor="#FFFFFF">
                              <td colspan="3"><img src="/images/Misc/Spacer.gif" width="160" height="11" /></td>
                                  </tr>
                                </table>
                                       
                                </td>
                        </tr>
                </table>
           </div>            
        </td>
<!-- END thumb_cell --></code>

Are you using any existing php includes you had (such as for the header/navigation section) for anything outside of the gallery and if so, how did you resolve the path references within those includes? I chose not to use includes because of path references. Once I am done with development of this I will be moving it to the root instead of so deep in the folder path. I just knew I needed to do it somewhere off the beaten path.

If you didn't/aren't using includes for navigation, etc, I would assume then that you just copy/pasted your existing navigation code to the template.html file... yep! 

By the way, ironically, the people I'm doing this gallery for are also using it to run a contest! cool, this is the 4th one that I have installed/tested and it has a lot of functionality. Good Luck!

[eventide]

Thanks, everyone for the help. Phil (and susied) that linked post with the instructions (really a fairly detailed walkthrough) will do the trick.

I just wish I could somehow reference my existing includes. Because this is on the html page, I'm having to duplicate my nav menus which are generated with php & javascript in the rest of the site. Picky, I know, but I'm a strong believer in the fact that the more duplication there is, the more chance there is for mistakes - edit one page and all pages are updated. My kind of programming!

[eventide]

One final thing: is there any way to edit/remove/add links to the SYS and SUB menus other than editing the theme.php file?

Thanks!

[eventide]

One final thing: is there any way to edit/remove/add links to the SYS and SUB menus other than editing the theme.php file?

Thanks!

Dang! I wish I could edit my own posts!

I did try editing the themes.php file (tried just commenting out some of the <td> tags to remove a couple of links) but got some errors in the process.

[phill104]

One final thing: is there any way to edit/remove/add links to the SYS and SUB menus other than editing the theme.php file?

Thanks!

If you search the forums that has been asked tons of times before with numerous detailed answers.

Please bear in mind that we have a one question per thread policy.

[eventide]

Sorry - you're right. I should've searched first, which would have avoided the second question in this thread!