× ABOUT DOWNLOADS PROJECTS WORK
    cyberpunk.sh
Profile photo

PREMCHAND CHAKKUNGAL

SENIOR SOFTWARE ENGINEER

I am a regular online shopper and buys lot of stuff online. I always prefer to buy from shopping website’s retail/official warehouse just to ensure that I am receiving original products.

Recently, I thought of upgrading my old desktop PC (Mobo Intel DP45SG) by adding up two 2GB DDR3 1333MHZ 2RX8 Dual channel RAM sticks. I started searching online for similar listings and found Kingston KVR1333D3N9/2G in two famous Indian shopping websites. Though the sellers were not official warehouse of the website, I even ordered one RAM stick on last Saturday from one of the website which at the time of writing is still awaiting dispatch. As I was checking the website today to know the status, I noticed lot of 4 star and 5 star reviews for the item/seller. Out of curiosity, I just checked the other shopping website and found these similarities for the same product.

Website 1

Website 2

In the above two images, except the number of months, everything else seems to be same including the UPPER CASE WORDS. Funny part is both were reviews given by “Certified Buyers“.
What do you think? Is this a fake review? or Is this a mere coincidence?

I started this blog almost 4 years back (as of 29 june 2017) and still keep it running. Over these years, I have tried everything from plain html files to full scale content management systems like Concrete, WordPress and Joomla.

Last year, I heard of a new blog engine named ‘Ghost’. Being a fan of Node.js, I spent a month porting my wordpress theme and it’s contents to Ghost which was pretty intresting at the beginning but only to realize later that it even took away my interest in blogging. After using both WordPress and Ghost for quite some time, I would say that:

  • I must admit that for a Blog Engine, Ghost is quite simple, clean, faster and easy to use for Creating Content. But apart from that, there needs to be something to help us make changes to the layouts, widgets. WordPress on the other hand offers tons of those things.
  • Image upload is creepy. For me, manually uploading files and directly providing the URL in the content was far too easy compared to adding the image tag and waiting the upload section to show up. ( Oh come on, why isn’t there any image upload like WordPress).
  • Updating Ghost again requires server access. Not everyone is having free time to login the server and update the scripts, whenever a new version is out.
  • When thinking of HTML, custom CSS along with the Ghost Markdown Scripting, what a pain.
  • When I started using, there wasn’t any plugins for Ghost.

In the End, I would like to say that Ghost is good when more emphasis is given for security, performance, simplicity and content. And WordPress is suitable if you really want to deliver an out of the box, interactive Blog.

Recently. I tried a couple of Rich Text Editors for one of my projects. I tried almost everything from Bootstrap-wysiwyg to CKeditor. But all had either compatibility issues or incomplete features. 

As I was actively looking for an editor, summer note caught my eye. It’s a free editor with hell lot of features and fully compatible with Internet Explorer, Firefox and Chrome. The integration too is simple and it supports Bootstrap too.

All you have to do to integrate Summernote in your app is to add reference to summernote’s css and javascript files to your page, define a div as follows: 

<div id="summernote">Hello Summer</div>

and finally, add a function to capture document ready event in your page as follows :

$(document).ready(function() {
  $('#summernote').summernote();
});

For more information, check out summer note at http://summernote.org

At last, the much awaited Moto Z Droid and Moto Z Force Droid are available for pre-order in US. The Moto Z Droid is available for $624 where as the Moto Z Force Droid is available for $720. Moto-maker helps you to build and customize your phone before buying.
Order now at http://www.motorola.com/us/products/motomaker/MotoMods

Ghost is a very powerful blogging tool which helps you to concentrate on the content rather than the plugins and the underlying components. However, a search bar would be an essential component for a blog, as it helps returning customers or users to search for a specific post.

image-searchboxYou might have noticed the same search bar on the left side of this website. The search bar works with the help of Google Custom Search. It accepts a query string and pass it to a Ghost Page which accepts the query and display results from Google Custom Search.

So, let’s get started by pasting the below HTML snippet into any of your Ghost Blog Page or into default.hbs file of your Ghost template.

   <form method="get" action="/search">
    <label>Search for:</label>
    <input type="search" placeholder="Search …" value="" name="q" title="Search for:">
           <input type="submit" value="Search">
        </form>

Now save the page (or update your template files in the server if you have modified default.hbs and refresh the theme) and the above HTML snippet must have added a very basic search box to your blog as shown below.

image-searchbasicLeave styling for now as we will address that in a later post. For the note, we can add the styling classes either from template or from any framework like Bootstrap to make it look more beautiful as I did in this website.

Now create an empty page in your Ghost Blog with name search, all in lower case.

Navigate to Google Custom Search and sign-in with your Google account.

You will land up in Dashboard as shown in the following screenshot.

image-googlecse1

Click Add to create a new custom search. A form will be displayed as shown below. Enter your domain name and click Create.

image-googlecse2

You will get a success message like the one shown below.

image-googlecse3

Click Get code to view the code snippet.

image-googlecse4

You can paste this directly into the search page which will show a Google Custom Search Box which may not match your blog’s theme, which has a Google Custom search logo and is very difficult to customize.

image-cseSo, we will modify the Custom Search to accept the query from our HTML form, process it and display the result. To do this, go to Look and Feel from the left navigation menu and the following screen will appear.

image-googlecse5

Select Results Only and click on Save and Get code has shown below.

image-googlecse6

You will get the new modified code snippet which you can paste in the search page of your Ghost Blog.

image-googlecse7

Save and refresh your Ghost Blog. Try the new search bar, type any query and press enter. This will navigate to
yourdomain.com/search?q=query+string which in turn will display the results.

Let me know your queries or comment. I will publish a guide for styling the same search box in another post and will update the link later.