The Cubbyholes Plugin

Discussion Forums > Plugins, Customizing, Source Code

Replies: 10 Views: 91

Ed Goodall Fusion Technology Posts: 422 Reg: Oct 01, 2011 Wiltshire, UK 12,320	confirm \| cancel 06/22/14 05:22 AM (10 years ago) The Cubbyholes Plugin Hi Within the cubbyholes plugin, where it says 'raw HTML', is that literally <img src="..."><p>Hello</p> or something else? Can anyone give an example? Thanks Ed Title Comments Hi Within the cubbyholes plugin, where it says 'raw HTML', is that literally <img src="..."><p>Hello</p> or something else? Can anyone give an example? Thanks Ed

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	06/22/14 08:38 AM (10 years ago) You put in the HTML just as you had described it. Be sure to use inline CSS. This screenshot is an example of an HTML block that is embedded within the entire screen. Notice that it is a scrollable block of HTML. The lighter colored HTML links are styled with inline CSS. Using the URL Scheme, the links can point right over to another screen within your app! (don't let the User wander away from the app :-) https://www.buzztouch.com/files/plugins/NS_Cubbyholes/screenshots/screen04.jpg Come on back if you have more questions! :-) -- Niraj Comments You put in the HTML just as you had described it. Be sure to use inline CSS. This screenshot is an example of an HTML block that is embedded within the entire screen. Notice that it is a scrollable block of HTML. The lighter colored HTML links are styled with inline CSS. Using the URL Scheme, the links can point right over to another screen within your app! (don't let the User wander away from the app :-) https://www.buzztouch.com/files/plugins/NS_Cubbyholes/screenshots/screen04.jpg Come on back if you have more questions! :-) -- Niraj

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	06/22/14 09:47 AM (10 years ago) For those who might be scratching their heads, here are the rest of the Cubbyholes screenshots: https://www.buzztouch.com/plugins/plugin.php?pid=9B9377C1CD78780457CD176 Remember to show us the cool screens you make with the Cubbyholes plugin! :-) -- Niraj Comments For those who might be scratching their heads, here are the rest of the Cubbyholes screenshots: https://www.buzztouch.com/plugins/plugin.php?pid=9B9377C1CD78780457CD176 Remember to show us the cool screens you make with the Cubbyholes plugin! :-) -- Niraj

epicweb Aspiring developer Posts: 159 Reg: Aug 30, 2012 Glen Carbon 4,990	06/22/14 12:08 PM (10 years ago) Hi Naraj, Do you have any apps using this plugin? I would like to check it out. Comments Hi Naraj, Do you have any apps using this plugin? I would like to check it out.

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	06/22/14 12:16 PM (10 years ago) Howdy Epic -- I have several apps using the plugin. However, they are private amongst a few folks. The screenshots are real. That app will be released to the public. Let me know if you have particular questions! :-) -- Niraj Comments Howdy Epic -- I have several apps using the plugin. However, they are private amongst a few folks. The screenshots are real. That app will be released to the public. Let me know if you have particular questions! :-) -- Niraj

Ed Goodall Fusion Technology Posts: 422 Reg: Oct 01, 2011 Wiltshire, UK 12,320	06/24/14 07:52 AM (10 years ago) Niraj, I just tried this <!-- The image here --> <img src="http://ares.xxxxxxxxx.co.uk/apps/co.uk.xxxxxx.xxxx/images/helpdesk.png"> <!-- Text here --> <p style="font-family:Arial; color:#343434;">Helpdesk</p> and all I got was "Helpdesk" in Times New Roman with no image on the device... any ideas? -- Ed Comments Niraj, I just tried this <!-- The image here --> <img src="http://ares.xxxxxxxxx.co.uk/apps/co.uk.xxxxxx.xxxx/images/helpdesk.png"> <!-- Text here --> <p style="font-family:Arial; color:#343434;">Helpdesk</p> and all I got was "Helpdesk" in Times New Roman with no image on the device... any ideas? -- Ed

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	06/24/14 08:12 AM (10 years ago) Let's try moving that image into the Xcode project and changing the img src reference accordingly. Font rendering is a new wrinkle -- not sure about that one. I will look into it all in the evening (I am on California time). Rather than guess at it, please send me your BT_config.txt file via Private Message. -- Niraj Comments Let's try moving that image into the Xcode project and changing the img src reference accordingly. Font rendering is a new wrinkle -- not sure about that one. I will look into it all in the evening (I am on California time). Rather than guess at it, please send me your BT_config.txt file via Private Message. -- Niraj

Ed Goodall Fusion Technology Posts: 422 Reg: Oct 01, 2011 Wiltshire, UK 12,320	06/24/14 08:32 AM (10 years ago) Ok Niraj, will send now. Thanks! Comments Ok Niraj, will send now. Thanks!

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	07/05/14 01:31 AM (10 years ago) @Ed -- the medical situation has subsided, I've had a moment to address your question about the HTML coding for the Cubbyholes plugin. For this screenshot, the HTML text has a link that is colored and not-underlined. The font used is Verdana at 10px. The body of the HTML has it's background set to black and so does the div block. http://postimg.org/image/sjg6j9kkt/ The hyperlink href points back to the app to be sent to a customURL screen that has a Nickname of JoeFlaccoCollegeTeam. That custom URL points to this link: http://en.m.wikipedia.org/wiki/Delaware_Fightin%27_Blue_Hens_football I send the User to another screen for a tap on the link of "Delaware Fighting Blue Hens". That way, the full-screen web page won't be shown within that small HTML block. Instead, that Delaware web page will be shown using the entire screen. The hyperlink is sent back to the App by using the Custom URL Scheme as described in this tutorial in the How To section of the Buzztouch.com site. If you see errors in the guide, let me know and I shall update it. https://www.buzztouch.com/files/howtos/BuzzTouch%20URL%20Scheme%20with%20Xcode%205.pdf Finally, here is the HTML code. Due to JSON, do not use double quotation marks nor single quotation marks within the HTML code. <body style=background-color:#000000><div style=background-color:#000000;color:#FFFFFF;font-family:Verdana;font-size:10px>Joseph Vincent Flacco played for the <a href=myAppURLScheme://JoeFlaccoCollegeTeam style=color:lime;text-decoration:none>Delaware Fighting Blue Blue Hens</a> football team in college. <p>In his rookie year, Flacco started every game and led the Ravens to two road wins in the 2008-09 NFL playoffs, becoming the first rookie quarterback in league history to win two road playoff games.</p></div></body> -- Niraj Comments @Ed -- the medical situation has subsided, I've had a moment to address your question about the HTML coding for the Cubbyholes plugin. For this screenshot, the HTML text has a link that is colored and not-underlined. The font used is Verdana at 10px. The body of the HTML has it's background set to black and so does the div block. http://postimg.org/image/sjg6j9kkt/ The hyperlink href points back to the app to be sent to a customURL screen that has a Nickname of JoeFlaccoCollegeTeam. That custom URL points to this link: http://en.m.wikipedia.org/wiki/Delaware_Fightin%27_Blue_Hens_football I send the User to another screen for a tap on the link of "Delaware Fighting Blue Hens". That way, the full-screen web page won't be shown within that small HTML block. Instead, that Delaware web page will be shown using the entire screen. The hyperlink is sent back to the App by using the Custom URL Scheme as described in this tutorial in the How To section of the Buzztouch.com site. If you see errors in the guide, let me know and I shall update it. https://www.buzztouch.com/files/howtos/BuzzTouch%20URL%20Scheme%20with%20Xcode%205.pdf Finally, here is the HTML code. Due to JSON, do not use double quotation marks nor single quotation marks within the HTML code. <body style=background-color:#000000><div style=background-color:#000000;color:#FFFFFF;font-family:Verdana;font-size:10px>Joseph Vincent Flacco played for the <a href=myAppURLScheme://JoeFlaccoCollegeTeam style=color:lime;text-decoration:none>Delaware Fighting Blue Blue Hens</a> football team in college. <p>In his rookie year, Flacco started every game and led the Ravens to two road wins in the 2008-09 NFL playoffs, becoming the first rookie quarterback in league history to win two road playoff games.</p></div></body> -- Niraj

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	07/05/14 01:41 AM (10 years ago) Also, notice that the HTML block is scrollable within it's frame. This screenshot shows the content after it has been scrolled. The lime-green hyperlink is now at the top of the HTML block. http://postimg.org/image/fzyuckoid/ -- Niraj Comments Also, notice that the HTML block is scrollable within it's frame. This screenshot shows the content after it has been scrolled. The lime-green hyperlink is now at the top of the HTML block. http://postimg.org/image/fzyuckoid/ -- Niraj

Niraj buzztouch Evangelist Posts: 2943 Reg: Jul 11, 2012 Cerritos 37,930	07/06/14 12:43 PM (10 years ago) I forgot that you also asked how to reference images within the HTML block. If you are using images that are already in your Project, then use this format as shown in the screenshot: <img src=BlueHens.png> http://postimg.org/image/qd6ajsdxx/ If you are using images that are on the Internet, then use this format as shown in the screenshot: <img src=http://www.buzztouch.com/images/icon-like.png> http://postimg.org/image/oe1nm48o1/ For completeness sake, here is the entire HTML code block: <body style=background-color:#000000><div style=background-color:#000000;color:#FFFFFF;font-family:Verdana;font-size:10px>Joseph Vincent Flacco played for the <a href=http://en.m.wikipedia.org/wiki/Delaware_Fightin%27_Blue_Hens_football style=color:lime;text-decoration:none>Delaware Fighting Blue Blue Hens</a> college team. <div style=text-align:center><img src=BlueHens.png></div></p> In his rookie year, Flacco started every game and led the Ravens to two road wins <img src=http://www.buzztouch.com/images/icon-like.png> in the 2008-09 NFL playoffs, becoming the first rookie quarterback in league history to win two road playoff games. </p></div></body> -- Niraj Comments I forgot that you also asked how to reference images within the HTML block. If you are using images that are already in your Project, then use this format as shown in the screenshot: <img src=BlueHens.png> http://postimg.org/image/qd6ajsdxx/ If you are using images that are on the Internet, then use this format as shown in the screenshot: <img src=http://www.buzztouch.com/images/icon-like.png> http://postimg.org/image/oe1nm48o1/ For completeness sake, here is the entire HTML code block: <body style=background-color:#000000><div style=background-color:#000000;color:#FFFFFF;font-family:Verdana;font-size:10px>Joseph Vincent Flacco played for the <a href=http://en.m.wikipedia.org/wiki/Delaware_Fightin%27_Blue_Hens_football style=color:lime;text-decoration:none>Delaware Fighting Blue Blue Hens</a> college team. <div style=text-align:center><img src=BlueHens.png></div></p> In his rookie year, Flacco started every game and led the Ravens to two road wins <img src=http://www.buzztouch.com/images/icon-like.png> in the 2008-09 NFL playoffs, becoming the first rookie quarterback in league history to win two road playoff games. </p></div></body> -- Niraj

Login + Screen Name Required to Post Login to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.

Discussion Forums > Plugins, Customizing, Source Code

The Cubbyholes Plugin

Title

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments

Comments