About design and nearby

Using location.search to locate a parameter’s value

Posted: February 9th, 2016 | Author: | Filed under: Development, Tips and Tricks | Tags: , , , , | No Comments »

Once I worked on jQuery isotope and the task was to link to a specific category, so that users can come from other pages to the filtered category. So if I had a page with services list (services.html) and wanted to filter the services by design it would look like (services.html/?mode=design) and show the design proposition only.

I decided to use the value parameter:
1. ‘location.search’ property returns the querystring part of a URL; for http://www.swd.com/services.htm/?mode=design

  1. var x = location.search;

the result of ‘x’ is

  1. ?mode=design

Read the rest of this entry »

Share Button

How to Add ‘active’ class to menu tab in ASP.NET MVC

Posted: November 10th, 2015 | Author: | Filed under: Development, Tips and Tricks | Tags: , , , | 1 Comment »

Every time you are working on application it’s a must to have the basic functionality to highlight selected menu item. In HTML it’s not a problem to add certain class to the navigation tab to highlight current page menu tab:

  1. <li class="selected"><a href="#">Home</a></li>

In MVC project you can dynamically set the active list item, based on the view that is being called. In other words, when the user is looking at the home page, the following HTML should be created:

  1. <ul>
  2. <li class="selected"><a href="#">Home</a></li>
  3. <li><a href="#">Services</a></li>                                
  4. </ul>

There are two ways to solve the issue even:

1. To do the above, I created MVC HTML helper class, containing method to apply my CSS class according to some conditions (MenuHelper.cs):

  1. using System;
  2. using System.Web.Mvc;
  3. using System.Web.Mvc.Html;
  4.  
  5. namespace YourWebApplication.Helpers
  6. {
  7.     /// <summary>
  8.     ///  Menu current active item helper class.
  9.     /// </summary>
  10.     public static class MenuHelper
  11.     {
  12.         /// <summary>
  13.         /// Determines whether the specified controller is selected.
  14.         /// </summary>
  15.         /// <param name="html"/>The HTML.
  16.         /// <param name="controller"/>The controller.
  17.         /// <param name="action"/>The action.
  18.         /// <returns></returns>
  19.         public static string IsSelected(this HtmlHelper html, string controller = null, string action = null)
  20.         {
  21.             const string cssClass = "selected";
  22.             var currentAction = (string)html.ViewContext.RouteData.Values["action"];
  23.             var currentController = (string)html.ViewContext.RouteData.Values["controller"];
  24.  
  25.             if (String.IsNullOrEmpty(controller))
  26.                 controller = currentController;
  27.  
  28.             if (String.IsNullOrEmpty(action))
  29.                 action = currentAction;
  30.  
  31.             return controller == currentController && action == currentAction ?
  32.                 cssClass : String.Empty;
  33.         }
  34.     }
  35. }

Read the rest of this entry »

Share Button

Submitting Form: PHP header(Location: …)

Posted: June 11th, 2015 | Author: | Filed under: Development, Tips and Tricks | Tags: , , , , , | No Comments »

Once I got a weird trouble with submitting contact form.

My website was powered by WordPress and the contact form was placed at the default page (single page design), so I want the form to submit to the page itself that the form is on.

Read the rest of this entry »

Share Button

How to Add an Anchor Link to WordPress pagination

Posted: May 7th, 2015 | Author: | Filed under: Development, Tips and Tricks | Tags: , , , | No Comments »

There are a few ways to setup WordPress pagination, or ‘paged’ links. I do prefer to work with paginate_links because of set of its arguments, which could be customized according to your needs.

Pagination with anchor link

Read the rest of this entry »

Share Button

WordPress Pagination: How to Make it Work

Posted: May 6th, 2015 | Author: | Filed under: Development, Tips and Tricks | Tags: , , , , | No Comments »

Function next_posts_link/ previous_posts_link prints a link to the next/ previous set of posts within the current query. It default usage is

  1. < ?php next_posts_link(); ?>
  2. < ?php previous_posts_link(); ?>

And usually you work with the pagination such way:

  1. < ?php if (have_posts()) : ?>
  2. < ?php while (have_posts()) : the_post(); ?>
  3. < ?php the_content(); ?>
  4. < ?php endwhile; ?>
  5. < ?php next_posts_link('&laquo; Older Entries') ?>
  6. < ?php previous_posts_link('Newer Entries &raquo;') ?>
  7. < ?php else : ?>
  8. <p>Page 404</p>
  9. < ?php endif; ?>

wordpress pagination

The tricky part comes if you need to print certain number of posts and keep the pagination.

Read the rest of this entry »

Share Button

Looking for a Freelance UX & UI designer for your project? I’m ready to jump onboard!

Let's discuss your project now