Knowledge Article 0410:
How can I display a SellFolio project in an existing webpage?

Applicability: SellFolio 4.0 Complete.

_________________________________________________

Explanation

You'll need basic HTML editing skills, or knowledge of working with your existing HTML webpages in a web editor.  For basic HTML editing guidance, a recommended site is www.w3schools.com .  To see an example of a SellFolio project embedded in an existing webpage, please see http://www.mikestileinstallation.com/gallery.htm .  This is an example project that we created as a consulting project.

Solution 1

It's recommended that you build your project in 640x480 fixed size, as this size tends to fit well in existing webpages.  This is set in Step 2 of SellFolio 4.0 Complete.

Upload your project to the server, in its own subfolder.  For instance, this would be a sample folder structure on the server:

<WEBROOT>   <--this folder would contain your existing webpages
          images   <--this folder would contain your images for the existing webpages
          sellfolio_project   <--this folder would contain the contents of your project's Bin folder
                    images   <--this folder would contain your project's images folder

Because your SellFolio project has a file called sellfolio.html, this folder would reside in the sellfolio_project folder.  Therefore, the hard path to that file would be http://www.yourdomain.com/sellfolio_project/sellfolio.html .  The relative path to that file would simply be sellfolio_project/sellfolio.html .

Now, in your existing HTML webpage, you'll need to add an iframe to display the SellFolio project.  Note that not all browsers may support iframes, so this is a technique that may or may not work.  There are other ways to display a SellFolio project, but that's beyond the scope of this article.  Below is sample HTML code that builds a 640x480 table, and then inserts an iframe into that table.  Note that the iframe references the relative path of sellfolio_project/sellfolio.html .

<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#626C61" width="640" height="480">
     <tr>
          <td>
               <iframe src ="sellfolio_project/sellfolio.html" frameborder="0" width="640" height="480"
                    scrolling="no" marginheight="0" marginwidth="0">
                    <p>Your browser does not support iframes.</p></iframe>
               </iframe>
          </td>
     </tr>
</table>