Hi! I’m trying to incorporate a part of another website in a clients’ site (this is officially allowed to to in this special case). It’s the news-section of a site, for which I don’t have a link to an rss-feed (which would of course make things simpler). So I am trying to show the news-page inside a limelight-iframe, which principally works just fine. But in this case also the header (including navigation) of the other page is shown in the iFrame, while I only want to show the actual news-content. I thought this could be done by “hiding” parts of the external page with “…: hidden”, but that doesn’t work (hm, I should have known that this cannot work). Then I tried to at least jump to a certain div of the external site by adding #divname to the link I use inside Limelight (so that the navigation-/header-items of the source-page are not seen initially), but that also doesn’t work. Aaargh, feeling so stupid… :-/
Is there a chance to only show the div with the news inside Limelight? This would be awesome… ;-)
Here are some links:
The site where I will show/import the news from the external page: https://www.asb-rheinlahn.de/2019/
The page with the news which I want to import: https://www.asb.de/news
Would be glad for any hints regarding this.
(By the way: Im ‘limelighting’ the external news inside a SectionsPro stack. I have limited it’s width so that at least only the mobile header-stuff of the source page is shown instead of the desktop-content)
PS: I want to add that I have no access to the ‘source page’, so that I’ll not be able to add any code to it.
The Limelight VIS stack will hide content if it is inside a Limelight iFrame - ideal for menus etc on the page to be imported.
If you have no access to the source page then it would require an exercise in custom JS to strip out the unwanted DIV’s.
Thanks Tav. So, without “an exercise in custom JS” there’s no chance to hide some divs from the imported page (or to show only a certain div), right?
And the Limelight VIS stack neither won’t help me in my special case, right? At least I didn’t find a setting there to address divs in the imported page.
Hm, and “jumping” to a certain div on the imported page by adding s.th. to the Import-URL probably also won’t work, right?
Sigh…
If you have no access to the external page then your only real option is to trigger some JS when limelight opens This would then need to look for specific divs on the external page and hide them, there is no way around that. Obviously this code would need to be completely specific to the external page in question.
I do have a limelight child stack that imports certain divs from a page via AJAX but I never released it because the user would have to manage the CSS and JS manually -i.e. importing the HTML alone will result in a completely unstyled result - you need to either inline the CSS/JS or load the external files manually. This is not really a very RW type of approach.
Thanks for these insights, Tav. I also don’t think that this limelight div child stack would make sense in my case (or would be too tough to handle for most users). So, either my client will have to stick with the current solution or he has to provide me with an RSS feed address. We’ll see…
1 Like