176Reactions
Generate Box Plugin for StudioPress

Generate Box Plugin for StudioPress Generate Child Theme

The folks from StudioPress did great job on designing the Generate Child Theme, I picked it for one of my new projects because that child theme has what I need. But while working on the new site and building the front page, I found out that there is no option to display the optin box “Generate Box” on the “front page“, it only works on the home page, then I discovered a quick solution.

WordPress Generate Box MenuActually, the solution was posted at StudioPress support forum after that, so I won’t share it here. But what I did was actually putting together a quick solution to display the Generate Box wherever you want on your blog, that’s my new WordPress plugin, the Generate Box.

Once you install the plugin, a new menu item under StudioPress menu:

Clicking on that menu item will take you to the Generate Box plugin settings page.

The Generate Box plugin Options

generate box plugin options

As you can see from the screenshot above, you can:

  • Change the color scheme (the 4 colors has been added)
  • Add optin form title, badge image and text
  • Embed your email form HTML code
  • And, choose where to display the Generate Box!

All this without having to edit your child theme’s code, and you will enjoy your Generate Child Theme even more.

generate box styles

Special thanks to Rafal Tomal, lead designer of Copyblogger Media who designed the Generate Box.

If you are using the the Generate Child Theme, get the Generate Box plugin from wordpress.org and have more functionality and control over the box!

I create websites with WordPress, and I develop Thesis Skins. I am a social network lover. I am also the night creature who works hard to keep this project up. Owner and founder of the Famous Blog.

GET FREE EMAIL UPDATES

Get our latest articles delivered to your email inbox, plus download our FREE 15 minutes later marketing guide.

We respect your privacy!

{ 37 comments… add one }

  • subhan December 19, 2013, 12:04 am

    thanks for the tutorial. I have just bought generate theme by studio press. I really hope my blog will generate lots of subscriber by using this theme. I like The Generate Box in the homepage.

  • Megan November 25, 2013, 12:37 pm

    I have installed the Generate Box plugin and everything has worked thus far but I am getting a 404 error when I try to submit name and email to sign up for the newsletter. I believe I have the ‘Email Services’ setting box not filled in correctly. Can you please help! Thank you.

    • Hesham Zebida November 27, 2013, 3:11 pm

      Please, double check your form HTML code, looks like the form action is not correct.

  • Jackson Nwachukwu June 11, 2013, 4:45 pm

    I run the Genesis Generate Theme on my blog.

    Generate box no doubt is a stuff to use. My blog is very new but I was surprised to see how it got me a handful of subscribers even when I had few articles on the site.

    It’s worth using!
    Jackson Nwachukwu recently posted..7 Basic Things To Do in Your First Week of BloggingMy Profile

  • Servando Silva
    Twitter:
    March 14, 2013, 2:27 am

    Hello Hesham,
    Do you know how can I change the color of the Generate Box to match the one from my Blog?
    I’d be happy to use this plugin with my new design!

    Thanks on advance.
    Servando Silva recently posted..Squarespace vs WordPress – Which one is for me? (2013)My Profile

    • Hesham Zebida March 14, 2013, 3:12 am

      Servando, the plugin has 4 color schemes, if CSS is not enough to change the colors, then you can download the PSD file from StudioPress.com and edit it.

  • Felix Albutra
    Twitter:
    February 1, 2013, 2:27 am

    Hi Hesham,
    I tried to install the plugin but I am having an issue regarding the activation of the plugin. I meet this compatibility error. It says that I need to use Genesis 1.7.1 version or higher. But I am currently using the latest version of the Genesis which is the 1.9.1 version. Please help me out.

    - Felix
    Felix Albutra recently posted..The Only IM Course You Need to Build a Profitable Online Business. Read This!My Profile

    • Hesham Zebida February 1, 2013, 12:37 pm

      I’ve just tested out the plugin with Genesis version 1.9.1 and it works fine for me!

  • Megan January 13, 2013, 10:20 pm

    Hi Hesham, I love your plugin, and have been playing around with it for a few hours and am hitting a brick wall trying to make a change, and am wondering if there’s any fix for what I want to do. I’ve significantly changed the way that the generate child theme looks (although underneath, it’s the same). I am trying to insert an image into the background of the generatebox. That’s easy enough, but unfortunately the “input” box is positioned absolutely (or something), and I can not figure out how to move the input box to the bottom of the generatebox. Does that make any sense at all? If not, go to http://megwinget.com and all will be clear. Can I move the box that contains all the text and the form fields to the bottom of the generatebox?

    Thanks so much for any advice/help/code you could provide.

    –Meg

    • Hesham Zebida February 1, 2013, 12:42 pm

      Sorry for the late reply.

      I can’t assist you without seeing the box on your site. And, by the way the form and inputs are not set to absolute position, you can use add margin to your styles to re-position them.

      • Mark August 29, 2013, 12:03 pm

        Thanks for a great plugin – this has allowed me to finally get the generate box working. Like Megan, I have a problem with the positioning of the optin form within the generate box; it’s too far to the right so my ‘Sign Up’ button is completely hidden under the image. You can see the problem at my site here: http://www.hobbyrailroader.com

        I’m a complete newbie, so I’d be very grateful if you could tell me which file to edit, and give an indication of what code I need and where I should put it. Thanks in advance.

        Mark

        • Hesham Zebida August 29, 2013, 8:59 pm

          Inside the download .zip download file, you will find other images in the images folder, try to find the one you want, then simply upload it via the WordPress media uploader, and use it within the plugin settings.

          • Mark August 30, 2013, 7:21 am

            Hi, thanks for the reply, but I think you misunderstood the problem. The appearance of my form had probably changed by the time you looked at it. For any future visitors who are as incompetent as me I will leave the ‘answer’ I came to after mucking around with the CSS for hours. In WP go to Plugins>Editor and edit the file generate-box/style/red.css (or orange/green/blue depending on what you’re using). In the section under ‘#generate_box #mce-EMAIL,’ I had to add the line ‘margin-left: -15px;’ to move my form a bit to the left within the box (also had to strip out the CSS from the Aweber form code first). This isn’t quite satisfactory as the form now hides the arrow image and I can’t find a way to get the arrow on top of the form – Hesham, is this possible? When I try to change the z-index of the section ‘#generate_box form’ it seems to affect the form and the arrow together – not sure where in the code I can just change the layer the arrow is in.

  • Sean Nelson November 19, 2012, 12:41 am

    Great plugin. Was going to use the Generate theme but with your plugin was able to use with Executive 2.0.

    Is there a way to use a short code in the plugin?

    I’m using the box for a 3 field form. Using three elements makes the generate box too big which doesn’t look good. Instead I want to just have the button which links to a modal to display form. Of course sugar model uses short codes.

    Thank You.

  • Cotton Rohrscheib
    Twitter:
    September 25, 2012, 6:25 pm

    Is there a way to just us the box on a single page or post? I see it has that option but when I add it it shows up on all posts? I’d prefer a shortcode that I could just drop in a page or a post that I want the box added to…

    Thanks, great plugin!!

  • Saksham Talwar May 13, 2012, 2:51 pm

    1..2..3.. and boom, the box is there. I love this plugin so much!

  • JB March 30, 2012, 7:16 pm

    The plugin looks great on desktop browsers, but one of the great features of the generate theme is the responsive design which displays appropriately on phones and tablets. This plugin breaks that responsiveness, and defeats the purpose of the theme for mobile viewers. The box on the studiopress demo displays perfectly, but your plugin does not.

    Do you know of an easy fix for this? Thanks in advance..

    • Hesham Zebida March 31, 2012, 1:57 am

      Wow, that was so true :) but not anymore.. It’s now responsive, I’ve updated the plugin to the WordPress repository, it should show an upgrade notice in your dashboard soon, of you can just download it and upgrade manually!

      Thanks a lot for pointing me to this, I have no idea how I missed this!

      • JB March 31, 2012, 10:26 am

        Looks 1000x better – thanks!

        The input box for the email address is still stretching outside the subscribe box by maybe 25 pixels – hard to tell on my Android. All of the other elements definitely adjusted though and it looks much better.

      • JB March 31, 2012, 10:30 am

        I checked generatebox.com and the input box is fine, so it must have something to do with my code for my mailchimp form. Sorry about that.

        • Hesham Zebida March 31, 2012, 2:55 pm

          There is nothing really wrong, take a quick look to your MailChimp form HTML code, and remove the id=”mce-EMAIL” from the input box.

          Let’s see if this will fix it.

          • JB April 1, 2012, 8:43 am

            That fixes the issue for mobile, but doesn’t display properly on desktop browsers. It shrinks the input box to half the height and it throws off the balance with the Submit button.

            I’ll mess around with it some more and see if I can come up with something.

            • Hesham Zebida April 1, 2012, 4:15 pm

              I see what you mean, I will have to take another look into the plugin when I have time.

              Thanks.

            • Scott Dowling
              Twitter:
              May 28, 2012, 9:03 pm

              JB, what solution did you (and/or Hesham) come up with on the box? I am using AWeber and have a similar problem with the alignment of the Submit box within the Generate Box.

              ** Reply from Hesham:

              I can’t reply to your comment because threaded comments are already reached the limits (too many replies to one comment), so here is my reply to you…

              I think the issue is with the code you are using to display the form, I see some java script and styles, make sure you are using the HTML version of the Aweber form, and also remove any styles from it!

              I hope this solve it!

  • Terence ONeill March 25, 2012, 11:47 am

    I really love this theme by studiopress. Great demo.
    Terence ONeill recently posted..Why use wordpress to build a websiteMy Profile

  • Sanjeev
    Twitter:
    March 24, 2012, 3:56 am

    Nice Plugin Hesham, I just used it at one of my blog and it worked. I do not understand why it was not the inbuilt function but at least we can do it now..
    Sanjeev recently posted..5 Movie Quotes That Will Improve Your BusinessMy Profile

  • Nada March 20, 2012, 4:44 am

    “The Genesis Framework empowers you to quickly and easily build incredible websites with WordPress.”I guess i should try this theme asap.It seems very easy to use and very easy to navigate.

  • Ayaz
    Twitter:
    March 20, 2012, 3:06 am

    Very nice plugin.

    I am using the generate theme for my blog and I was looking for this kind of functionality in my blog as previously box was only appearing on home page but with this plugin I can use that any where on the blog with different colours.

    Thanks for creating this plugin Hesham.
    Ayaz recently posted..Kristi Hines Shared Her Best Formula to Build High PR BacklinksMy Profile

  • Servando Silva
    Twitter:
    March 20, 2012, 12:22 am

    Thanks Hesham. I’m using “Magazine” Child theme but I was actually looking for something like this without moving to the “Generate” Theme.
    I already tested it and while I need to tweak it a little, It will work.
    Servando Silva recently posted..Top 3 WordPress Themes Providers to create a professional BlogMy Profile

  • Imran Soudagar
    Twitter:
    March 19, 2012, 2:37 pm

    Thanks for sharing useful information. BTW I think this theme is pretty costly for beginners like me. I prefer free themes.

  • Larry
    Twitter:
    March 18, 2012, 8:36 pm

    This is a very nice plugin, I have the same questions as Zimbrul. Can the plugin be used with other child themes, or can it only be used with the Generate theme?

    I would like to be able to use it as a “Call To Action” after my posts. Can I insert it into my template, or can I insert the code into Genesis Simple Hooks to include it after my posts?

    • Hesham Zebida March 19, 2012, 3:26 pm

      Hi Larry,

      I assure you it works with Genesis Framework, I’ve tested that while I was coding the plugin, and probably it will work with most of the StudioPress child themes.

      The box won’t look good in the after post area, you will have to do some work to make it show there and style it.

  • zimbrul
    Twitter:
    March 18, 2012, 8:20 pm

    Fantastic plugin and I’ve got few questions:
    -Does it work only with Generate theme?
    -Can you add any HTML in the plugin box? Mail Chimp?
    I’m asking the latter because (if I’m not wrong) the actual generate box was meant to be used with Feedburner.
    zimbrul recently posted..Why women don’t blog better than manMy Profile

    • Hesham Zebida March 19, 2012, 3:23 pm

      Hi Zimbrul ,

      The plugin works if Genesis framework is installed, I’ve test it on the framework without the child theme, so I don’t see anything that could stop it from working with any of the StudioPress child themes, however it wont look good or fit on all of them. Anyways, you just need to test it out and see how it goes.

      You can add any HTML form, which means it should work with all email services just fine.

  • Amrik
    Twitter:
    March 18, 2012, 1:11 pm

    Hello Hesham,

    Well I am presently using Geneis with customised theme and very satisfied. This theme will sure help to grab some subscribers list. Thanks!
    Amrik recently posted..What Makes A Profitable Website?My Profile

    • Mohamed Osam
      Twitter:
      March 19, 2012, 2:34 pm

      Do you mean Genesis Amrik? If so, I use that too, and happy with the outcome. I run into situations sometimes where I wish they had a few more options here or there to customize the theme a little bit better, but overall their designs are just super professional. :)
      Mohamed Osam recently posted..Making Spam Go AwayMy Profile

Leave a Comment

CommentLuv badge

This blog uses premium CommentLuv which allows you to put your keywords with your name if you have had 3 approved comments. Use your real name and then @ your keywords (maximum of 3)