Open a welcome message (image, inline, etc.) in a Shadowbox style

  • I am using the Shadowbox JS plugin in my self hosted wordpress at https://diariodebate.info in order to open my pictures, galleries, links and other stuff with this excellent plugin.

    In shadowbox-js website, they mention this:

    When using markup, each of these properties is automatically derived from the link element itself using the Shadowbox.buildObject method. But now that you know what’s really going on behind the scenes, you can just pass objects (or arrays of objects) that contain these properties to Shadowbox.open as in the following example:

    <link rel="stylesheet" type="text/css" href="shadowbox.css">
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">
Shadowbox.init({
    // let's skip the automatic setup because we don't have any
    // properly configured link elements on the page
    skipSetup: true
});

window.onload = function() {

    // open a welcome message as soon as the window loads
    Shadowbox.open({
        content:    '<div id="welcome-msg">Welcome to my website!</div>',
        player:     "html",
        title:      "Welcome",
        height:     350,
        width:      350
    });

};
</script>

    I wonder if is it there a way to do the same in this or any other plugin: to open an image, link, html, inline element, etc. by using this plugin and if somebody have succeeded doing it. Any ideas will be tested.

    I haven’t found a solution yet, so I am using an index.html page previous to the index.php in order to show some content at the very beginning of the page.

    Thanks in advance.

    https://www.ads-software.com/extend/plugins/shadowbox-js/

Viewing 2 replies - 1 through 2 (of 2 total)

  • Try that.
    just split the script in two parts ! worked for me…

    <link rel="stylesheet" type="text/css" href="shadowbox.css">
<script type="text/javascript" src="shadowbox.js"></script>
<script type="text/javascript">

<script type="text/javascript">
Shadowbox.init({
    // let's skip the automatic setup because we don't have any
    // properly configured link elements on the page
    skipSetup: true
});
</script>

<script type="text/javascript">
window.onload = function() {

    // open a welcome message as soon as the window loads
    Shadowbox.open({
        content:    '<div id="welcome-msg">Welcome to my website!</div>',
        player:     "html",
        title:      "Welcome",
        height:     350,
        width:      350
    });

};
</script>
    Thread Starter Geppettvs D'Constanzo

    (@geppettvs)

    Thank you very much lambdaka

    Yes, it does the trick very well. But I changed from the self hosted Shadowbox to a plugin and I find really exciting that the plugin itself can be called by dropping the second part of the code -as you mention- in order to run the welcome message.

    I am refering to this portion of code:

    <script type="text/javascript">
window.onload = function() {

    // open a welcome message as soon as the window loads
    Shadowbox.open({
        content:    '<div id="welcome-msg">Welcome to my website!</div>',
        player:     "html",
        title:      "Welcome",
        height:     350,
        width:      350
    });

};
</script>

    The plugin that I am using right now is the updated Shadowbox JS Version 3.0.3.10.2 | By Matt Martz

    This way I am inserting the second portion of code at the very top in my template’s index.php in order to run such effect only in the main site and not on individual posts.

    I really appreciate a lot your efforts and your help. They are useful for me.

    Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Open a welcome message (image, inline, etc.) in a Shadowbox style’ is closed to new replies.

Tags