Using The Wrapper Function

From PhpCOIN Documentation

Jump to: navigation, search

If you want to integrate your current website design/layout with phpCOIN (v1.x) and do not want to modify one of the themes that are included with phpCOIN, then this article is for you.

This article refers to phpCOIN version 1.x only. It is highly recommended you upgrade to the latest version of phpCOIN for security & hack prevention reasons.

The default theme for phpCOIN is earthtone, located in /coin_themes/earthtone. While you can edit any themes files to make phpCOIN look like your website there is no need to switch from the default theme to accomplish this goal.

You will need to have a working install of phpCOIN, a style-sheet editor, and a general text-file editor to proceed. It is assumed you have a good understanding of style-sheets and the phpCOIN admin area.


In the Admin area, you enable the "wrapper" and disable display items you do not want:

Admin -> Parameters -> theme -> package -> Disable Footer (bottom) Block: YES
Admin -> Parameters -> theme -> package -> Disable Header (top) Block: NO 
 (can experiment with yes, but you may lose menu buttons)
Admin -> Parameters -> theme -> package -> Disable Menu Columns (Left / Right): YES
Admin -> Parameters -> theme -> package -> Enable- Package Wrapper: YES
 (this is the most important setting)
Admin -> Parameters -> theme -> package -> Enable- Menu User in Header Block: NO
Admin -> Parameters -> theme -> package -> Enable- Menu User in Header Row: YES
Admin -> Parameters -> theme -> package -> Site- Page Header Make Clear: YES
Admin -> Parameters -> theme -> package -> Site- Page Header Show Date: NO
Admin -> Parameters -> theme -> package -> Site- Page Header Show Logo: NO


The style-sheets are located in the coin_themes/xxxx/ folder:

styles.css 
styles_print.css can also be edited if required

You must change the content of the style-sheet(s) to match your colors and fonts, and add any styles that you need that are not in the style-sheet.


The wrapper files are located in the coin_themes/xxxx/html folder:

wrapper_bot.inc
wrapper_top.inc

You use these files to create your own look etc.


Basically, what you do is tell phpCOIN to output only the main content and phpCOIN will use whatever is in wrapper_top.inc and wrapper_bot.inc for the top/left column and right column/footer respectively. Edit the wrapper_bot.inc and wrapper_top.inc to generate your logo, buttons, etc. and edit the style-sheets to complete your transformation.


Additional Advice & Example:

How do I add a table on the outside of phpCOIN?

To do this you will need to make use of the wrapper function. How you actually achieve it will depend on whether you are taking a table or div approach. Basically, the concept is the same in that you place the opening tags in /coin_themes/theme/html/wrapper_top.inc and the closing tags in /coin_themes/theme/html/wrapper_bot.inc (where [theme] is the name of you theme folder) so they effectively wrap around the phpCOIN code.

wrapper_top.inc example:

<div>
!-- Insert layout code here that should appear top/left of phpCOIN --> 

wrapper_bot.inc example:

!-- Insert layout code here that should appear right/bottom of phpCOIN -->
</div> 

Naturally you will probably want to add your own stylesheet to achieve the look you are after. I use the wrapper on my site to have a custom masthead and make phpCOIN sit within a centred div, but the principles are the same for whatever you want to do...

For the sake of simplicity, let's think of your site as one large outer table with three rows: a header row, a body row and a footer row -- with each row having three cells (a 3x3 grid). phpCOIN will sit in the very middle of this table.

In this example we'll span the header and footer rows into one cell, but you may decide not to... it all depends on how you intend to layout your page.

Assuming you already have the header and footer rows worked out, how do you now place cells to the left and right side of phpCOIN? Easy... you start the cell to contain phpCOIN in the wrapper_top.inc file, but end it in the wrapper_bot.inc file.

Here's a really simple example for wrapper_top.inc:

<table>
 <tr>
 <td colspan="3">
 !-- Page header goes in here:  Note it spans 3 columns as the body row will have 3 cells
 across it -->
 </td>
 </tr>
 <tr>
 <td>
 !-- The content that sits to the left of phpCOIN goes here -->
 </td>
 <td>
!-- This is the end of this file as we want phpCOIN to appear in this cell --> 

...and then wrapper_bot.inc:

!-- Now close the cell opened in wrapper_top.inc -->
</td>
 <td>
 !-- The content that sits to the right of phpCOIN goes here -->
 </td>
 </tr>
 <tr>
 <td colspan="3">
 !-- Page footer goes here -->
 </td>
 </tr>
 </table> 

It is that simple. The same concept applies if you want to build your page with floating div's instead of td's.

[re-created from the original article by digdug]

Personal tools

Inscrita el Registro Mercantil de Mallorca Tomo 2140, Hoja No. PM-51034, Folio 135
This website owned and operated by: Technology Services RPVW S.L. CIF# B57345084
Avda Constitucion 48 Bajos Alaro 07340 Baleares SPAIN
Tel:+34 971518362    Fax: +34 971518368    eMail: support@phpcoin.com