Results 1 to 6 of 6

Thread: Open RSS feed items in overlay (eg.Lightbox)

  1. #1
    Join Date
    Aug 2005
    Posts
    22
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Open RSS feed items in overlay (eg.Lightbox)

    Hello,

    i have been playing with SimplePie via this script shared over here at DynamicDrive.

    After tweaking the whole thing and styling it I came up with this website which is my personal magazine.

    Now the problem is : clicking on a feed link will direct me to their website. i'm looking for a way to better integrate the original article within my website either by :
    - Automatically generating a dynamic page and retrieve the rest of the truncated text. (Not sure if this is possible without deep control of the feed)
    OR
    - Opening the page of the original article on a new layer (like you can open a picture on top of your webpage with lighbox).

    Of course i did try to simply open links in a new tab, but for some reason, it does not really satisfy me.

    Dos you have any idea of scripts that I could use to achieve either of these goals ?

    Thank you very much
    Last edited by Guillaumeb; 01-13-2012 at 01:12 PM. Reason: More precise title

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    You could use something like FancyBox or ColorBox to open them in an iframe within an overlay. However, many sites have 'break out of frames' code. So that might not work.

    You could open them in a new window though instead of a tab, the basic syntax for which is (can be all on one line):

    Code:
    <a href="whatever_the_feed_gives_you_here" target="_blank" 
    onclick="open(this.href, this.target, 'top=100, left=200, width=550, height=450'); return false;"
    >whatever_the_feed_gives_you_here</a>
    By the way, some browsers will block this and force a new tab or not do it at all. Less will do so live though, so if you're testing locally without a local server, don't get too discouraged.

    If you want more help integrating it with what you have, let me know. But you seem pretty savvy. However, I'd need to see the page you have and currently it's not loading very well for me. I gave up after 12+ seconds. I'd also probably need to know what PHP code you have where it differs from that of the DD script you linked to.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Aug 2005
    Posts
    22
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hey thanks for your reply.

    it's weird the page should not be loading for you. it's quite fast over here, even with cleared cache.

    Basically i took the script from DynamicDrive and edited the main.php file listing the RSS feeds to be fetched. Then I just placed several blocks on an HTML page
    http://dynamicdrive.com/dynamicindex...ybox/index.htm

    I copied the source of this HTML page in a txt file
    http://guillaumeb.com/newscenter-source.txt

    The problem is that I cannot really do that for each link that are generated, at least not in the HTML file. Maybe i have to dig in the other files though.
    Alternatively i was thinkg that maybe there would be a script forcing to open all links on a page to open in such an overlay (like there ar script forcing all links to open in a new window).

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    OK, I tried the page again and it came pretty much right up. But because of the code involved I cannot easily make a local mock up for testing. So we may have to experiment a little.

    Yes, you could do something to open all links in a new window, but aren't there other links on the page that you wouldn't want to have that treatment?

    Anyways, I see you already have jQuery on the page. So let's start by trying this. Add it to the bottom of the page, right before the closing </body> tag:

    Code:
    <script type="text/javascript">
    (function($){
    	$('div[class*=someclass] a').live('click', function(e){
    		open(this.href, '_blank', 'top=100, left=200, width=550, height=450, resizable, scrollbars');
    		e.preventDefault();
    	});
    })(jQuery);
    </script>
    The browser cache may need to be cleared and/or the page refreshed to see changes.

    If it doesn't work, leave it - or make a copy of the page with it so I can have a look at it to see what the problem might be.
    Last edited by jscheuer1; 01-13-2012 at 03:31 PM. Reason: add - resizable, scrollbars
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Aug 2005
    Posts
    22
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Oh Man! now it does look like something!!! you made my day!!! thank you so much!

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,920
    Thanks
    43
    Thanked 3,187 Times in 3,151 Posts
    Blog Entries
    12

    Default

    Great! I notice that in some cases the window isn't large enough. You can adjust the size in the code, and/or add the resizable and scrollbars keywords. These should probably be added anyway, and I've edited my previous post to show it as well:

    Code:
    <script type="text/javascript">
    (function($){
    	$('div[class*=someclass] a').live('click', function(e){
    		open(this.href, '_blank', 'top=100, left=200, width=550, height=450, resizable, scrollbars');
    		e.preventDefault();
    	});
    })(jQuery);
    </script>
    See also:

    http://www.w3schools.com/jsref/met_win_open.asp

    open and window.open are the same in this context.
    Last edited by jscheuer1; 01-13-2012 at 03:36 PM. Reason: add - See also . . .
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •