Google Places Map & Calendar - How I Got Them On My Site

Darter02Darter02 Major grinsMount Horeb, WIPosts: 946Registered Users Major grins
edited August 12, 2013 in SmugMug Customization
The new site not having iframe support seemed like a real pain for me as I really wanted my Google Calendar, and my Google Places Map on the new site. I have it on my old one, and I know folks use it when planning weddings, etc.

The way I got my calendar & map to appear may be a real no brainier for a lot of you, but I thought I'd share for people like me, who come at coding swinging a club...

First I created a post on Blogger that had both of the iframes for my calendar & map. Then I gave that post a specific label.

You then create a new page on Smug, and place a feed box in it. The URL you use is
ht tp://www.YOURBLOG.blogspot.com/feeds/posts/default/-/YOURLABEL

Notice I broke the http so this site won't make a link out of that. Also, make sure that hyphen is in there.

It worked for me. All I have to do is teak the iframe settings a bit.
«134

Comments

  • paulbrockpaulbrock Major grins Posts: 515Registered Users Major grins
    edited August 3, 2013
    interesting, thanks! I wonder if this would work for contact forms.....
  • paulbrockpaulbrock Major grins Posts: 515Registered Users Major grins
    edited August 3, 2013
    Contact form - IT WORKS!!!!!!!!! Best hack ever :)
  • nikongirl74nikongirl74 Big grins Posts: 46Registered Users Big grins
    edited August 3, 2013
    YAYYY! Thank you!! YOU ROCK!!! Make sure you toggle the "show description" in the feed box on smug for it to show up (: It took me awhile to figure that out.
  • Darter02Darter02 Major grins Mount Horeb, WIPosts: 946Registered Users Major grins
    edited August 3, 2013
    One thing I forgot to mention; if I didn't hit Done, and then Publish, I couldn't see the iframes in Preview Mode.
  • paulbrockpaulbrock Major grins Posts: 515Registered Users Major grins
    edited August 3, 2013
    I'll add a warning though - its possible Smugmug will see this is a bug, and remove the functionality. Hope not!
  • Darter02Darter02 Major grins Mount Horeb, WIPosts: 946Registered Users Major grins
    edited August 3, 2013
    I would doubt that. They'd have to disable feed blocks. Right now all they host is the feed block itself, not the actual iframe. Or am I missing something??
  • Cygnus StudiosCygnus Studios Commercial Photographer San Francisco's North BayPosts: 2,294Registered Users Major grins
    edited August 3, 2013
    Edit:

    I think that I got it, you guys ROCK!
    Steve

    Website
  • McQMcQ Grinning From Ear To Ear Posts: 165Registered Users Major grins
    edited August 4, 2013
    Darter02 wrote: »
    The new site not having iframe support seemed like a real pain for me as I really wanted my Google Calendar, and my Google Places Map on the new site. I have it on my old one, and I know folks use it when planning weddings, etc.

    The way I got my calendar & map to appear may be a real no brainier for a lot of you, but I thought I'd share for people like me, who come at coding swinging a club...

    First I created a post on Blogger that had both of the iframes for my calendar & map. Then I gave that post a specific label.

    You then create a new page on Smug, and place a feed box in it. The URL you use is

    Notice I broke the http so this site won't make a link out of that. Also, make sure that hyphen is in there.

    It worked for me. All I have to do is teak the iframe settings a bit.

    I'd love to do whatever this is in order to embed my Wufoo contact form, but I have pretty much zero clue as to what you're talking about. eek7.gif

    Any way you could explain this to those of us who think of swinging a club a high technology?
    Does it mean I have to get a blogger subscription as well?

    Thanks!
    "Where have you gone, Joe DiMaggio, our nation turns its lonely eyes to you?"

    http://mcq.smugmug.com
  • CindyCindy Major grins Posts: 542Registered Users Major grins
    edited August 4, 2013
    Workaround returns possible phishing site :-(
    Edit:

    I think that I got it, you guys ROCK!

    Steve, note your address in the bar, when I click your information contact me link I get this:

    i-mpRZ2xC-L.png

    So… are we back to the drawing board here? :cry
    Cindy Colbert (Utterback) • Wishing You Co-Bear Love, Hugs & Laughter!!!
  • paulbrockpaulbrock Major grins Posts: 515Registered Users Major grins
    edited August 4, 2013
    McQ wrote: »
    I'd love to do whatever this is in order to embed my Wufoo contact form, but I have pretty much zero clue as to what you're talking about. eek7.gif

    Any way you could explain this to those of us who think of swinging a club a high technology?
    Does it mean I have to get a blogger subscription as well?

    Thanks!

    here's how I did it. Get a blogspot account (free). Create a page on it with your wufoo code (the HTML one not javascript) and add a tag (like a keyword) called "contactform".

    here's mine: http://paulbrockphotography.blogspot.co.uk/2013/08/blog-post.html

    Once you've got that, in Smugmug customiser create a new page for your form. Only add a 'feed' box and set the parameter "URL" to (in my case) "http://paulbrockphotography.blogspot.com/feeds/posts/default/-/contactform";

    would show you the end result but not published yet!
  • paulbrockpaulbrock Major grins Posts: 515Registered Users Major grins
    edited August 4, 2013
    Cindy wrote: »
    Steve, note your address in the bar, when I click your information contact me link I get this:

    Looks like they need to change their link from "[email protected]" to "mailto:[email protected]"
  • Darter02Darter02 Major grins Mount Horeb, WIPosts: 946Registered Users Major grins
    edited August 4, 2013
    McQ wrote: »
    I'd love to do whatever this is in order to embed my Wufoo contact form, but I have pretty much zero clue as to what you're talking about. eek7.gif

    Any way you could explain this to those of us who think of swinging a club a high technology?
    Does it mean I have to get a blogger subscription as well?

    Thanks!

    You need a FREE Blogger account. You create a post, paste your iframe into that post. You'll see an interface on the right side where you can add labels to your post. Add one that is specifically for that post.

    For instance, if I was embedding my Google Map iframe, which you get from your map, just click that little chain icon to get the iframe link. Once you've pasted it into your blogger post, add a label for this specific post. For this instance, maybe "googlemap."

    Using that RSS code I wrote about up top, just swap out your Blogger page name. Mine's LutzR2. At the end put your label for the post you want the feed to come from.

    Hit DONE, and hit publish.
  • pipercreekphotographypipercreekphotography Big grins Posts: 83Registered Users Big grins
    edited August 4, 2013
    Nothing showing up in with this "hack"
  • Darter02Darter02 Major grins Mount Horeb, WIPosts: 946Registered Users Major grins
    edited August 4, 2013
    Nothing showing up in with this "hack"

    I'l try to help you tomorrow. It's Sunday, so family time, and all that...
  • nikongirl74nikongirl74 Big grins Posts: 46Registered Users Big grins
    edited August 4, 2013
    Worked great for me - thanks so much!iloveyou.gif
  • jbenayasjbenayas Chasing the light Posts: 18Registered Users Big grins
    edited August 4, 2013
    Thank you very much for the trick!

    I used it for my Contact Page and other pages (like this).
  • davidweaverdavidweaver Too busy to customize Posts: 681Registered Users Major grins
    edited August 4, 2013
    Brilliant! Worked for me the first time I tried it. I can edit the form in Wufoo and the changes are there immediately when I refresh my contact page.
  • pipercreekphotographypipercreekphotography Big grins Posts: 83Registered Users Big grins
    edited August 4, 2013
    Figured it out!!! wonderful!!!
  • pipercreekphotographypipercreekphotography Big grins Posts: 83Registered Users Big grins
    edited August 4, 2013
    Anyone know how to center the feed box...my calendar is off to the left. I would like for it to be centered.
  • Darter02Darter02 Major grins Mount Horeb, WIPosts: 946Registered Users Major grins
    edited August 4, 2013
    Anyone know how to center the feed box...my calendar is off to the left. I would like for it to be centered.

    While I haven't sorted out how to center it yet, I did discover you can change the aspect ratio. You can also change the calendar's header color bar, but I can't seem to change the overall BLUE color...

    calendar01-M.jpg
  • pipercreekphotographypipercreekphotography Big grins Posts: 83Registered Users Big grins
    edited August 4, 2013
    Darter02 wrote: »
    While I haven't sorted out how to center it yet, I did discover you can change the aspect ratio. You can also change the calendar's header color bar, but I can't seem to change the overall BLUE color...

    calendar01-M.jpg
    Yeah I believe that blue is google's standard. I haven't been able to change it.
  • McQMcQ Grinning From Ear To Ear Posts: 165Registered Users Major grins
    edited August 4, 2013
    paulbrock wrote: »
    here's how I did it. Get a blogspot account (free). Create a page on it with your wufoo code (the HTML one not javascript) and add a tag (like a keyword) called "contactform".

    here's mine: http://paulbrockphotography.blogspot.co.uk/2013/08/blog-post.html

    Once you've got that, in Smugmug customiser create a new page for your form. Only add a 'feed' box and set the parameter "URL" to (in my case) "http://paulbrockphotography.blogspot.com/feeds/posts/default/-/contactform";

    would show you the end result but not published yet!
    Darter02 wrote: »
    You need a FREE Blogger account. You create a post, paste your iframe into that post. You'll see an interface on the right side where you can add labels to your post. Add one that is specifically for that post.

    For instance, if I was embedding my Google Map iframe, which you get from your map, just click that little chain icon to get the iframe link. Once you've pasted it into your blogger post, add a label for this specific post. For this instance, maybe "googlemap."

    Using that RSS code I wrote about up top, just swap out your Blogger page name. Mine's LutzR2. At the end put your label for the post you want the feed to come from.

    Hit DONE, and hit publish.

    Thank you both for your kind help with this!!!
    "Where have you gone, Joe DiMaggio, our nation turns its lonely eyes to you?"

    http://mcq.smugmug.com
  • Cygnus StudiosCygnus Studios Commercial Photographer San Francisco's North BayPosts: 2,294Registered Users Major grins
    edited August 4, 2013
    Cindy wrote: »
    Steve, note your address in the bar, when I click your information contact me link I get this:

    i-mpRZ2xC-L.png

    So… are we back to the drawing board here? :cry


    That's seriously not good. Can someone check and see if this is still happening.
    Steve

    Website
  • CindyCindy Major grins Posts: 542Registered Users Major grins
    edited August 4, 2013
    That's seriously not good. Can someone check and see if this is still happening.

    Steve, Sorry I should have been more specific as to which link… It's when I click your 'Information' link in your nav bar & then your 'About Me' page & then your Contact me link in the sig line of your about me page… that's where it gives the above (not your contact link within the main nav bar).

    I'm looking forward to trying this out just as soon as I have more time. Thanks Everyone.
    Cindy Colbert (Utterback) • Wishing You Co-Bear Love, Hugs & Laughter!!!
  • Cygnus StudiosCygnus Studios Commercial Photographer San Francisco's North BayPosts: 2,294Registered Users Major grins
    edited August 4, 2013
    Thank you, that helps.
    Steve

    Website
  • brandofamilybrandofamily Just a Guy with a Camera Illinois USAPosts: 1,976Registered Users Major grins
    edited August 5, 2013
    jbenayas wrote: »
    Thank you very much for the trick!

    I used it for my Contact Page and other pages (like this).

    How'd you get it centered? All I could come up with was to add "empty" text/html" boxes to the left and right...
  • Cygnus StudiosCygnus Studios Commercial Photographer San Francisco's North BayPosts: 2,294Registered Users Major grins
    edited August 5, 2013
    I adjusted the margins to get mine as centered as possible. Still playing with the code to get better, but at least it works.
    Steve

    Website
  • brandofamilybrandofamily Just a Guy with a Camera Illinois USAPosts: 1,976Registered Users Major grins
    edited August 5, 2013
    I adjusted the margins to get mine as centered as possible. Still playing with the code to get better, but at least it works.

    Problem with that is it will be centered on your width screen, but maybe not on mine.
    At least the blank boxes will resize to different screen widths.
    You could try percentages for the margins instead of px
  • brandofamilybrandofamily Just a Guy with a Camera Illinois USAPosts: 1,976Registered Users Major grins
    edited August 5, 2013
    Here's my test page:

    http://www.tinleyparkfrankfortrotary.com/Information-Pages/What-are-some-Examples/n-4N5jd

    The form is for my photography site: www.brandolinoimaging.com

    but the test page is on a site I maintain and am converting to NEW SM.
  • brandofamilybrandofamily Just a Guy with a Camera Illinois USAPosts: 1,976Registered Users Major grins
    edited August 5, 2013
    I adjusted the margins to get mine as centered as possible. Still playing with the code to get better, but at least it works.

    Can you share your settings... your form stays the correct width... Mine gets narrower as page gets narrower...
Sign In or Register to comment.