Code Box

[glennbroadway]

The code box is great, but it is quite limited in functionality. I was hoping to be able to use it to add a Lightwindow style tool a Snappages website - but, alas, because it is in an iFrame it won't work.

- I'd love to be able to include extra Javascript files from the main page (probably a security risk).
- Maybe putting some dummy DIVs in the main page would allow us to implement some nice features (again, thinking about the Lightbox gallery things here. Of course dummy DIVs would only be useful if we could also add some CSS to style them.
- I'd love to be able to augment the CSS with custom CSS - If we're not going to get either of the first points then simply including some custom CSS in the Code Box specific page would be fine. It would at least enable us to style things in these blocks without having to put the CSS in-line.

IMPORTANT
As the Code Box is in an iFrame you should make Hyperlinks in this frame open in the parent window, rather than locally within the frame. For example, click one of the links in the HTML Twitter Widget here: http://glennbroadway.snappages.com/

[glennbroadway]

Just bumping this thread as I really do think the things I mention here are very important.

[Steve]

There are a few inherent limitations of the code box as you mentioned due to security restraints we had to place on the boxes themselves. Some of these other things might be doable, however I'll have to do some more looking into this before I could give a definite answer. Thanks again for all the help and feedback.

[glennbroadway]

Just been doing a bit of tinkering and it seems you can include custom CSS ANYWHERE in a page, and not just in the < head >. So for example, if you want to change the appearance of all UL (unordered lists) then this type of CSS would normally be in the head, or in a separate, linked file:

< style type="text/css" >
ul {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;line-height: 2em;font-weight: normal;font-variant: normal;text-transform: none;color: #00CC33;text-decoration: none;background-color: #CCCCCC;text-indent: 5px;list-style-type: square;}
< /style >

[without the spaces after and before the < > ]

Well, it actually turns out that you can put this in the middle of the HTML (presumably, before the element on the page at least).

I've put exactly that code in the Code Box here:
http://glennbroadway.snappages.com
...on the HTML Twitter feed in the centre column.

Now I know that's an ugly example, but I just wanted to prove it could be done.

Look next to it, in the right column however. You'll see an UL of recent blog posts from Feedburner. I have copied the CSS from the Snappages theme relating the ULs and pasted it in this Code Box, just above the script from Feeburner. It ALMOST makes the imported news items look like those just above it (which are from the Snappages blog).

I know it's not spot on (the last item messes up and the date line is too low, and not indented). But, again, with a bit of tweaking I'm sure we could get our Code Boxes to look just how we want.

[spjt]

This is helpful. Thanks Glen. I'm on the 14-day Pro Trial trying to wrap my head around this. Is there a way to change the overall background to an image? Either within a particular page or a theme?

[glennbroadway]

If I remember correctly, some of the themes (not all) allow you to import a background image.

[spjt]

Yes, I was able to get .png files to work. :)

I was wondering if there is a way to replace the color that is the
rectangular background for the blog area (not bodybackground). Can it be replaced with another .png in CSS? Or is that beyond the limitations of the theme? I need to brush up on CSS.

[glennbroadway]

If Snappages doesn't reveal an element to you for editing then there's no way to do it by any other means. The Code Box puts its contents in a little iFrame, so you can't even use that to hack about the CSS. I'm not certain, but I don't think the part of the blog that you want to change can be edited.

[church2churchUSA]

Hi, I am trying to do a running list of Items and Cities and have a Pop up window for More Information about each listing. I have 4 Icons on each listing
1. More Information - launches a POP UP Window with HTML Information
2. E Mail - Launches the E mail Program to E mail that listing
3. WWW - Launches that listings Website
4. MAP - Launches a Google map of the Location of that Item

when the Icons are loaded into a Snappages code box they jump all over the code box area ( the last ones disappear )

I have successfully loaded this HTML code and Pictures in www.webs.com and it works perfectly in that code box.

Does anyone have any suggestions? I have been working on this for over a month now and all the help I have gotten fron snappages so far are that the button pics look great when he looked at them ( He never tried to press the jumping Icons )

[Steve]

Can you send me a link to the page with the issue you are referring to?

[heartsandpaws]

Do not try to reset any of your code boxes at the moment. I tried to re-enter the code just recently on my website and it now will not let me save changes to that page. Now I had to take that page off the website! I would like some help on this today. The code enables clients of mine to register for classes and since it is messing up I will be unable to do that. Please advise.

Thanks

Trevor

[Steve]

We're looking into this problem. We think it's a problem with the cloud hosting that stores those code boxes so we are waiting to hear back on that and we'll update everyone when we know for sure. You might want to try saving it again because in my testing it seemed to be and off and on problem.