Category: Development

Categories
Development

Google AdSense Responsive Ads

I was pretty excited when I realized that Google AdSense was offering responsive sized ads. Kinda surprised it took me so long to notice it, but I’m not exactly raking in insane amounts of AdSense dollars at the moment.

Their Smart Sizing option is very convenient in that it will automatically detect the container elements width and then serve up an appropriate add based on that. While this is really slick and convenient I was getting much too tall ads due to the layout of my blog.

Luckily they do offer an Advanced mode, where you can modify some CSS Media Queries to request specific sized ads based on browser width. This was perfect.

In my case I wanted 3 sizes.

  • mobile devices (320px x 50px ad)
  • browsers with widths over 1400px (300px x 250px ad)
  • browsers with width under 1400px (120px x 240px ad)

So, I just adjusted the CSS Media Queries as such, and all seems to be working pretty well.

1
2
3
4

.my-ad { width: 320px; height: 50px; }
@media(min-width: 500px) { .my-ad { width: 320px; height: 50px; } }
@media(min-width: 800px) { .my-ad { width: 120px; height: 240px; } }
@media(min-width: 1400px) { .my-ad { width: 320px; height: 250px; } }
Categories
Development website

Sea Isle City Website and Mobile Apps

Sea Isle CityJust wrapping up some work for Sea Isle City on a new website and some mobile apps as well. The website is www.visitsicnj.com and the mobile apps are available for iOS and Android.

This was a rather large project, and working with the folks at 7 Mile Times was a pleasure yet again. They are extremely organized and great to work worth.

Kim provided an excellent design to build upon and Patty was fantastic is organizing content and keeping things rolling along. It was pretty great.

We built the site on a very stable CMS that made it very easy for the admins to manage the site. Training them literally took minutes if that, given the simplicity of the CMS.

The calendar presented some interesting issues. They wanted the events grouped into months, and working with dates/events can always be a challenge. After much trial an error a solution was found, and it didn’t require much overhead at all to execute.

This is not the first website I have worked on with these folks, so we’ve got a bit of a formula down and it really showed.

A mobile app for both the iOS and Android platforms was to be developed as well. Given the nature of the apps, we decided to build on the PhoneGap/Cordova platform and them create builds for each respective platform from that.

Mobile development is still a bit of an adventure for me, but this one did go a lot smoother than my last. Just having more hours under my mobile app development belt as well as improved libraries/info on hand really helped out.

We are pulling info from the website view web services we created, and the mobile app is consuming those JSON feeds to populate the app. It really is pretty amazing  one everything is setup and producing and consuming the web services. Pretty amazing, slick, and efficient.

While we of course hit some bumps and hurdles along the way, I’m glad to say we did meet our deadline and on budget! Not bad for such a large and complex project!

Still have some minor loose ends to wrap up, but all in all this was a very exciting and rewarding project to work on! I’ve learned much and we’ve put out a very solid product(s). The clients are extremely happy and have been the utmost pleasure to work with.

Categories
Design Development

joedag32.com 3.0 upgrades

I’ve been so busy that I keep putting off upgrades to this very blog. But I’ve finally gotten some time to get this blog with a fancy responsive design and make it a bit friendlier on tablets and larger screens too.

I looked over many CSS grids and decided that Pure would work best for me. I was very much impressed with their minimal footprint and it’s responsiveness. It was extremely easy to work with and flexible. I was very much impressed. Plus their blog layout example was almost too perfect for what I was hoping to achieve! It saved me a ridiculous amount of time!

While I mostly use jQuery for my framework of choice in most projects, I wanted to give YUI3 a crack in this one as my early roots go back to mostly YUI. It was a great working with YUI3, and I was very impressed with their TabView module. It worked great.

I really think that the new layout makes my posts much easier to read on mobile, tablets, and traditional users as well. So I’m very excited for that.

I’m still cleaning up my work section though. I’ve let that fall behind a bit, even neglecting to add many recent projects. So, that’s next on my list of things to do!

Categories
Development

Drupal 7 Repeating Date Show Only Once in Views

This one had me scratching my head for a little bit. I had some events in Drupal and was using the fine Date module and had a few with repeating dates. I was able to display the repeating dates just fine, but was getting numerous entries displaying of the event itself.

Not 1 event with the various repeating dates being displayed.

After much head scratching and some digging around I found a solution.

I added a filter of Date (delta) and set equal to 0. So now I’m only grabbing on event instance.

 

Categories
Development

Display a Field Image Outside of the Content Region in Drupal 7 Using Views

I had a project where they wanted a big header image to appear on some of the content pages, above the content. I knew this wouldn’t be too difficult to do, but I was a bit initially stumped as to how best to do it using Drupal 7. I didn’t want to have to install too many modules for it to work, so I decided to start with Views as that module would be installed on the site anyway (of course).

Turns out this is pretty easy to do using Views.

  • First I added an Image field to my Content Type. Then I set the display to Hidden for that field. Easy basic Drupal Content Types stuff so far. Nothing fancy.
  • Then I created a View. A block in this case, and had it display the image field I had created.
  • Under Advanced, I clicked on Contextual Filters. From the list, I chose Content (Nid). I want to filter out by the node id of the current page being viewed. Simple still.
  • Next under the contextual filter options under the When the Filter Value is Not Available  I chose Provide a Default Value and Content ID from the URL from the drop down options.

This simply gets the Content ID from the URL of the current page you are on and then passes it to the filter.

Very easy to setup and works just fine for me!

Categories
Development

Cordova statusbar for iOS Plugin

Since iOS 7 was released a month or so ago I’ve been completely stumped with fixing my Cordova iOS app that relied on jQueryMobile. I couldn’t find a clean solution to fix the now changed handling of the statusbar in iOS 7. I had come up with some CSS hacks to work around, but was having a hard time getting my fixed headers to cooperate with jQueryMobile.

I finally noticed that a statusbar plugin had been released for Cordova (PhoneGap). I immediately went to the command line and added it to my project!

I did have a little bit of a time figuring out how to make my statusbar behave like an iOS 6 app. It turned out to be much simpler than I was expecting and of course I was over thinking it.

I just had to edit the config.xml file. In my case I set the preference tag “StatusBarOverlaysWebView” true and a custom color for the statusbar in the preference tag “StatusBarBackgroundColor” as well. Then the plugin worked it’s magic!