1 Topic by Alex21 (edited by Alex21 2012-10-07 03:00:35)

  • Registered: 2012-10-07
  • Posts: 6

Topic: Title and Text

Hey!, im trying to put some text in the gallery and title by adding in xml code:

<div id="footer">
      <p></p>
      <p></p>
    </div>   

But changes are not shown, i have tryed erasing cache and cookies from safari, but nothing

I also tryed to put a new div called footer to complete the instruction and nothing:

#footer {
        width: 100%;
        height: 40px;       
    }
Bit of help would be appreciated, I really need to put information for users.

One more question, how ca i add a static Title over the gallery?

Thank you

EDIT:If this is not the issue, then how can i change the background of the gallery and embbed a new one to replace the original?.

2 Reply by Alex21 (edited by Alex21 2012-10-07 00:25:04)

  • Registered: 2012-10-07
  • Posts: 6

Re: Title and Text

Sorry about double posting, i forgot something:

The fullscreen button gallery does not appear, i kinda liked it...

  • Registered: 2008-07-06
  • Posts: 6,334

Re: Title and Text

Hey!, im trying to put some text in the gallery and title by adding in xml code:

<div id="footer">
      <p></p>
      <p></p>
    </div>   

But changes are not shown, i have tryed erasing cache and cookies from safari, but nothing

I also tryed to put a new div called footer to complete the instruction and nothing:

#footer {
        width: 100%;
        height: 40px;       
    }

Reduce the height of the #flashcontent <div> in the gallery's 'index.html' page to make room for your footer.
By default, it takes up 100% of the browser window height:

#flashcontent {
        height: 100%;
    }

Try changing the '100%' entry in the code above to either a smaller percentage or an absolute pixel value.

One more question, how ca i add a static Title over the gallery?

You could add a header to your page similar to your footer.
Otherwise, if you want to overlay text on top of your gallery, you could add code such as the following to the <body> section of your gallery's 'index.html' page (changing the values as required):

<div id="overlay" style="position: absolute; top: 10px; left: 10px; font-size: 40px; font-family: Verdana;">Text goes here</div>

In order for this to work, you will need to make your gallery's background transparent by following the instructions here.

EDIT:If this is not the issue, then how can i change the background of the gallery and embbed a new one to replace the original?.

By making the background transparent (as above), any background set via CSS on your HTML page will shine through.
For example, if you wanted to have an image as your background, you could use something like the following code in the <head> section of your gallery's 'index.html' page:

<style type="text/css">
    body {
        background-image: url: ('images/background.jpg');
    }
</style>

For further information on the use of the CSS 'background-image' property, please see here.

The fullscreen button gallery does not appear, i kinda liked it...

Make sure that you are using the latest version of TiltViewer-Pro (v1.3.2) and check that you have the following two lines in your gallery's embedding code:

fo.addVariable("showFullscreenOption", "true");
fo.addParam("allowFullScreen","true");
Steven Speirs
SimpleViewer Support Team

4 Reply by Alex21 (edited by Alex21 2012-10-08 00:58:06)

  • Registered: 2012-10-07
  • Posts: 6

Re: Title and Text

Thx for your time.

After all pics end, you can t go back, i guess my version is older but can i fix this by using xml?

Im starting to use dewplayer, how can i emmbed the dewplayer over the gallery as text, do i have to change the

percent of flashcontent to emmbed the player?

EDIT: Now i know i can have an image (jpg) for background, but if i want to emmbed an HTML template replacing the

background, is this possible? (just like this one: http://johnsondigital.in)

  • Registered: 2008-07-06
  • Posts: 6,334

Re: Title and Text

After all pics end, you can t go back,

Set:

fo.addVariable("useReloadButton", "false");

... in your gallery's embedding code to use the previous and next navigation arrow buttons instead of the circular reload button.

i guess my version is older

Upgrades are free within the same major version number so, as a TiltViewer-Pro v1.x user, you can download the latest version (v1.3.2) using the download link from your purchase email. If you cannot find your purchase email or your link has expired, please fill in this Upgrade Request Form to request a new download link.

Im starting to use dewplayer, how can i emmbed the dewplayer over the gallery as text, do i have to change the

percent of flashcontent to emmbed the player?

Instructions for embedding Dewplayer on an HTML page can be found on this web page.
In order to embed Dewplayer on top of a TiltViewer-Pro gallery:
(1) Encapsulate the Dewplayer embedding code indside a <div> such as the following:

<div id="audio" style="position: absolute; top: 20px; left: 20px;">
...
</div>

... and place the <div> inside the <body> section of your HTML page.
(2) Make your gallery's background transparent by following the instructions here.

EDIT: Now i know i can have an image (jpg) for background, but if i want to emmbed an HTML template replacing the

background, is this possible? (just like this one: http://johnsondigital.in)

The web page you quoted essentially has a header (with a navigation menu) with a gallery below it and an image as the background for both. You can view the source of the page in a browser to see how this was achieved.

Steven Speirs
SimpleViewer Support Team

6 Reply by Alex21 (edited by Alex21 2012-10-08 16:18:43)

  • Registered: 2012-10-07
  • Posts: 6

Re: Title and Text

I though everything but check the source code, nice one there.

Thank's you a LOT for everything from the top to the end.

See you around Steven

  • Registered: 2012-10-07
  • Posts: 6

Re: Title and Text

Me again, can t keep this doubt, heres the code including dewplayer:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Hiperrealismo Urbano</title>
<script type="text/javascript" src="swfobject.js"></script>
<style type="text/css">    
    /* hide from ie on mac \*/
    html {
        height: 100%;
        overflow: hidden;
    }
    
    #flashcontent {
        height: 100%;
    }
    /* end hide */

    body {
        height: 100%;
        margin: 0;
        padding: 0;
        background-color: #000000;
        color:#ffffff;
        font-family:sans-serif;
        font-size:60;
    }
        
    a {    
        color:#cccccc;
    }
</style>
</head>
<body>
    <div id="flashcontent">This page requires the latest Flash player. <a href="http://www.macromedia.com/go/getflashplayer/">Get Flash here.</a> If you have Flash installed, <a href="index.html?detectflash=false">click to view</a>.</div>
    <div id="audio" style="position: absolute; top: 20px; left: 20px;">
    <object type="application/x-shockwave-flash" data="dewplayer-multi.swf" width="240" height="20" id="dewplayer" name="dewplayer"> <param name="wmode" value="transparent" /><param name="movie" value="dewplayer-multi.swf" /> <param name="flashvars" value="mp3=test1.mp3|test2.mp3|test3.mp3&amp;autostart=1" /> </object></div>
    <script type="text/javascript">
        var fo = new SWFObject("TiltViewer.swf", "viewer", "100%", "100%", "9", "#000000");            
        
        // TILTVIEWER-PRO CONFIGURATION OPTIONS
        // To use these options, uncomment them by removing the '//' at the start of the line
        // For a description of config options, go to: 
        // http://www.airtightinteractive.com/projects/tiltviewer/pro/config_options.html
        //
        fo.addVariable('user_id', '88211512@N07');
        //fo.addVariable('tags', 'jump,smile');
        //fo.addVariable('tag_mode', 'all');        
        //fo.addVariable('columns', '5');
        //fo.addVariable('rows', '5');
        fo.addVariable('linkLabel', 'CLICK');
        fo.addVariable('showLinkButton', 'true');
        fo.addVariable('showTakenByText', 'false');
        //fo.addVariable('zoomedInDistance', '1400');
        //fo.addVariable('zoomedOutDistance', '7500');
        //fo.addVariable('fontName', 'Times');
        //fo.addVariable('titleFontSize', '50');
        fo.addVariable('descriptionFontSize', '32');
        //fo.addVariable('linkFontSize', '40');    
        fo.addVariable('textColor', '0xffffff');
        //fo.addVariable('linkTextColor', '0x00ff00');
        //fo.addVariable('linkBkgndColor', '0x0000ff');        
        //fo.addVariable('frameColor', '0xff0000');
        fo.addVariable('backColor', '#808080');
        //fo.addVariable('bkgndInnerColor', '0xff00ff');
        //fo.addVariable('bkgndOuterColor', '0x0000ff');        
        fo.addParam("wmode", "transparent"); 
        fo.addVariable("bkgndTransparent", "true"); 
        fo.addVariable("showFullscreenOption", "false");
        // END TILTVIEWER-PRO CONFIGURATION OPTIONS
        
        fo.addParam("allowFullScreen","false");
        fo.write("flashcontent");            
        
    </script>    
</body>
</html>

I've checked it thousand times, guess everything its in its place but player still without work, it doesn't even show in screen, hope you can catch some mistake or wrong code. Thx in advance.

  • Registered: 2008-07-06
  • Posts: 6,334

Re: Title and Text

Your code seems to be fine. I have just tried it in a test gallery and Dewplayer shows up in the top-left corner of the gallery as expected.
You have chosen to use the Dewplayer-Multi player so make sure that the 'dewplayer-multi.swf' file is located in your gallery folder alongside your gallery's 'index.html' page.

Steven Speirs
SimpleViewer Support Team
  • Registered: 2012-10-07
  • Posts: 6

Re: Title and Text

It works now: here's the code if some1 want s to use it, only for dewplayer-multi and 3 sample tests i used:

<object type="application/x-shockwave-flash" data="dewplayer-multi.swf?mp3=mp3/test1.mp3|mp3/test2.mp3|mp3/test3.mp3" width="240" height="20" id="dewplayer-multi"><param name="wmode" value="transparent" /><param name="movie" value="dewplayer-multi.swf?mp3=mp3/test1.mp3|mp3/test2.mp3|mp3/test3.mp3" /></object>

Thx again Steven.