15 Best WordPress Event Themes: For Conferences and More

Conferences and networking events are one of the best ways to promote your business and establish relationships with potential clients as well as business partners.

An essential part of any successful event or conference strategy is setting up a website to promote it and to create a resource that explains all the benefits of signing up for your event.

Why You Should Use an Event Theme

Even though you may already have a website for your business, setting up a separate website for your event has a couple of important benefits:

  • It gives your visitors a single call to action to focus on, which increases sign-up rates.
  • It reduces the chances of your visitors getting distracted by a page or a post that has nothing to do with the conference you’re trying to promote.

By creating a separate website, you will be able to build anticipation and excitement for the upcoming event. And selecting the right theme for your event plays a crucial role. In this theme showcase, we feature our best-selling WordPress themes made specifically for event websites

Best WordPress Event Themes available for sale on Envato Market ThemeForest
Best WordPress Event Themes, available for sale on Envato Market (ThemeForest)

A good WordPress events theme will have an appealing design and it will also make it easy to publish useful information for your attendees, such as the event location, session schedules, speaker profiles, as well as the ability to manage registrations and mobile responsive design.

Best-Selling WordPress Event Themes 

If you need to build a website to promote and support an event of any type, choosing one of the themes from this collection will give your project a great head start. Here’s our current top 15, one of which is sure to pique your interest:

New: Event Champ

Released for sale earlier this month (at time of writing) Event Champ comes with so many features and add-ons that it’s not possible to list them here. Its event finder is great for any multi-event website, allowing for category, keyword, location-based (and so on) filtering for whatever event you can dream of. Check out the details for more information about what’s in the box.

Event Champ  Multiple Events  Conference WordPress Theme
Event Champ – Multiple Events & Conference WordPress Theme

2. Ventcamp

Recently updated, VentcampWP is a very complete package; shipping with a range of custom contact forms, a schedule manager, speaker and sponsor sections, and comes with integration for the most popular eCommerce (WooCommerce and FooEvents, EventEspresso, Tickera) extensions to handle tickets sales. Its default homepage displays a very tight business theme, but it also comes with some great alternatives if you’re looking for a different aesthetic.

Ventcamp - Event and Conference Theme
Ventcamp – Event and Conference Theme

3. Eventum

First on the list is Eventum, a stylish multipurpose WordPress event theme that is perfect no matter what type of event you have in mind. This highly customizable theme offers all the essential features for an event website: managing tickets, venues, speakers, sessions, sponsors and everything else required to have a successful event. 

Additional features include five homepage variations, event countdown, integration with Google Maps and MailChimp, four color schemes, and a Visual Composer Builder that allows your to take your website to the next level.

Eventum - Conference  Event WordPress Theme
Eventum – Conference & Event WordPress Theme

4. Meetup

Meetup is a simple and easy-to-use theme with a clean and elegant design and plenty of features. It offers five different homepage layouts, all of which have plenty of sections for speakers, an event schedule, FAQs, a registration form, and a location map. Pre-built page templates include a separate blog page, gallery page, speakers page, parallax backgrounds on any page and the ability to include a video background. 

Other features include thorough customization options thanks to Visual Composer Builder, unlimited color schemes, support for Google Fonts, and responsive design.

Meetup - WordPress Conference Event Theme
Meetup – WordPress Conference Event Theme

5. Eventime

Eventime is a modern, multipurpose WordPress event theme with an impressive feature set. The theme includes three different demo designs which can be easily imported with one click and dedicated support for speakers post type, schedule post type, event countdowns, location maps and integration with Revolution Slider to make a great first impression on your visitors. 

Eventime also includes support for Google Fonts, Visual Composer Builder, WooCommerce, the ability to sell tickets, responsive design, and much more.

Eventime - Conference  Event Ticket Store Theme
Eventime – Conference & Event Ticket Store Theme

6. Venue X

Venue X is a simple events theme for WordPress that’s perfect for small scale event venues, concert halls, arenas, theaters, and centers. With this theme, you can create, list, and organize events. Also, readily sell tickets, showcase galleries, news, and media. You can create a full-blown website or a simple one-page website, depending on the size of your event. 

This theme’s features include responsive design, unlimited color schemes, Google Fonts support, page builder with 28 fully customizable blocks, and a unique header builder with more than 40 header options to make an eye-catching design.

Venue X - Simple Events WordPress Theme
Venue X – Simple Events WordPress Theme

7. iVent

iVent is a responsive, multipurpose WordPress conference theme built for any kind of event, summit, meetup, workshop, or music festival with integrated ability to sell tickets for your event. iVent has a very elegant, modern design and features different sections for speakers, event listings, countdown, and schedule. 

This theme comes with plenty of advanced features which include five homepage variations, two custom post types, compatibility with Events Calendar Plugin, Live Theme Customizer, and is SEO Friendly. It also includes support for WooCommerce, Slider Revolution, Visual Composer, and other popular plugins. The icing on the cake is the extensive custom shortcodes which allow you to develop attention-grabbing, interactive content.

iVent - Multipurpose Event WordPress Template
iVent – Multipurpose Event WordPress Template

8. Electron

Electron is a perfect theme for anyone looking to organize a music event. It has a bright and minimal design that includes pre-built page templates for all the important pages of your website as well as a landing page, sales page, and a customer support page. Electron has a variety of design options which include a page builder, unlimited color schemes, integration with Tickera events and Eventbrite events. 

With two attractive menu styles, homepage demos, dedicated sections for event listings, highlights, and speakers, Electron is sure to bring all the right attention to your musical event.

Electron - Event Concert  Conference WP Theme
Electron – Event Concert & Conference WP Theme

9. Event Management

The Event Management WordPress Theme makes it easy to organize multiple events such as conferences, exhibitions, trade expos, award ceremonies, annual functions, seminars and many others.

The theme features an elegant design focused on bringing attention to key details such as event schedule, speakers, event countdown and location. What’s more, this theme allows you to easily sell tickets, handle registration, and keep attendees updated via dedicated photo galleries and a blog section. This theme is fully responsive and includes plenty of customization options, two homepage variations, grid and list view of events, and much more.

Event Management - WordPress Theme
Event Management – WordPress Theme

10. Eventer

Eventer is a modern and interactive theme with a high focus on encouraging visitor engagement. The theme features a responsive design that’s easily customizable, registration forms, an da theme customizer. 

It includes a variety of sections on the homepage, such as an event timeline, speakers, location, reservation information, testimonials, and a sponsors section. Grab this theme to make a professional event site and start getting attendees registered.

Eventer - WordPress Event and Conference Theme
Eventer – WordPress Event and Conference Theme

11. Unica

Unica is a WordPress event theme with a festive and elegant design. It’s perfect for corporate events, weddings, and any other type of social gathering events. Unica features easily customizable design with four different homepage layouts, built-in Revolution Slider, Essential Grid, PO Composer, and Visual Composer Builder. 

Other features include custom widgets for Instagram and Flickr, testimonial section, gallery section, custom shortcodes, ad section and more. Use this theme to build your event website to help get your group together for your special gathering.

Unica - Event Planning Agency Theme
Unica – Event Planning Agency Theme

12. iEvent

iEvent is a versatile WordPress event theme that gives you the option to create a one-page or a multi-page website, depending on the size of your event. This theme has a modern and professional design suitable for any type of event or conference. 

It’s fully responsive and offers seven different homepage styles, 10+ header styles, and unlimited color and font combinations to build just the event site you’re aiming for. 

Thanks to the Visual Composer Builder you can build any type of layout for your pages while the interactive exhibition map and event schedule will catch your visitors’ attention. 

iEvent - Event  Conference WP Theme
iEvent – Event & Conference WP Theme

13. The Meetup

The Meetup is a conference and event WordPress theme with powerful features like Event Management, Speaker Management, Team, Organizers and Sponsors management. This theme offers the ability to have video and parallax backgrounds, intelligent section management with 35+ different sections to choose from, unlimited color schemes, built-in shortcodes, several different blog and event styles, and much more.

TheMeetup - Conference Event WordPress Template
The Meetup – Conference, Event WordPress Template

14. Meeton

Meeton is a WordPress theme suitable for companies as well as event management websites. It features a clean and elegant design with responsive layout and special features like appointment forms, services, event planner, schedules, pricing plans and other pages.

Meeton offers three homepage layouts, five different speaker layouts, plenty of customization options thanks to the theme options page as well as Visual Composer Builder, and integration with the Timetable Responsive Schedule plugin. Use this theme to build your event website and launch your next conference or meetup.

Meeton - Conference  Event WordPress Theme
Meeton – Conference & Event WordPress Theme

15. TheEvent

TheEvent is an easy-to-use theme with event management features, speakers, schedule, FAQ, registration, booking, and an online ticket system. This theme has a responsive design that’s fully customizable via the theme control panel and Xpress page builder. Y

TheEvent comes with multiple homepage variations, PayPal integration, MailChimp integration, cross-browser compatibility and fast loading times. On top of that, TheEvent supports a variety of widgets to save you tons of time with content building. ou can create a great event site with this theme!

TheEvent  Event Management and Conference WP Theme
TheEvent – Event Management and Conference WP Theme

Best Practices for Event Websites

When it comes to building a WordPress event website, choosing a professional WP event theme, and then installing your chosen theme is not enough. Aside from making sure your website is responsive and loads fast, there are several different things to keep in mind to ensure your event is a complete success.

The goal of your event or conference site should be two-fold:

  1. Create awareness for your event
  2. Capture ticket sales

With that in mind, here’s our list of best tips and practices for event websites:

1. Insert the When and Where In Plain View

Even though some of your website visitors know when and where your event is taking place, it’s safe to assume that the majority of them have no clue. To reduce the chances of your visitors leaving your website in frustration, it’s crucial that you place this information front and center, as well as include a sign-up button or a form. You should also include a brief tagline that describes your event like in the Meetup theme.

2. Create a Brand for Your Event

Make sure your event is memorable by designing a special logo for it and use it not only on your website, but in every social media update, and on flyers and posters to promote your event. Make sure you use consistent colors and fonts to further improve the impression of your event.

3. Have a Clean, Organized Design

Don’t clutter up your page with unnecessary elements. If you need multiple pages, then keep your menu with only the links you need for your event. Highlight your speakers, signup dates, costs and only your most important information. Present your event details in a way that’s logical for a first-time visitor who’s just become interested in your event.

4. Add Plenty of Calls-to-Action

An event page with no distinct CTA is a wasted effort so make sure to include multiple calls-to-action that clearly stand out from the rest of your website. Don’t be afraid to use a bright color like the Eventer theme does, to draw attention to your CTA – whether that’s a link, a button, or a form that prompts the user to buy a ticket, apply as a sponsor or a speaker, or simply entice them to learn more about your event.

5. Include Speaker Pictures and Bios

Great speakers can do wonders to attract visitors and attendees to your event. The event page should show their faces and list their credentials similarly to the Eventum theme. Consider creating short videos of the speakers and including them on your website.

6. Promote Your Event on Social Media With a Special Hashtag

Promoting your event on social media is natural if you want to attract as many people as possible. Be sure to include social media sharing buttons on the registration page as well as the Thank You page. 

Take it a step further by creating a special hashtag for your event and use it not only to promote your event but to connect with people before and during the event. Also, consider including a link to your event in your social media bios across different profiles.

Build Your WordPress Event Website

Organizing an event or a conference is great way to boost your credibility and form new business relationships. With one of our high-quality event WordPress themes on ThemeForest and the tips above, your event will be ready for success. 

And if you need help setting up or customizing your event theme, work with one of our hand picked WordPress developers.

Source: Webdesign Tuts+

eversign Enables Electronic Signatures Anywhere, Anytime

Working remotely can be quite hectic – especially for freelancers. It seems like every minute of the day brings a new task or challenge. And when it comes to both sending and receiving documents that require signatures, doing things the old fashioned way isn’t going to help with efficiency.

That’s the beauty of eversign. Their service provides the ability to sign contracts or other documents electronically. The signatures are legally binding and, just as important; you can use the Lite version of their service for free. That saves you time, hassle and some cash.

Eversign legally binding electronic signatures

Essential Technology and Security

eversign makes the process of signing electronically simple, convenient and secure. Your data is encrypted with 256-bit SSL on an infrastructure that is closely monitored.

What’s more, you can easily set documents to automatically expire, export them to your own system and completely remove them from eversign’s servers. So you can take heart in the fact that eversign provides the utmost security.

You’ll also find features that make the whole process quick and easy:

Document Editor

All you need to get started is to upload an existing PDF file. Using eversign’s Document Editor, you can add in data fields via drag-and-drop for recipients to fill in items such as their name, company name and email address.

Need something more advanced? It’s easy to add radio buttons, checkboxes, drop down menus or even allow signers to upload and attach their own documents.

Eversign Document Editor

Sign from Anywhere – Even in Person

The days of faxing or mailing paper copies are over. With eversign, documents can be signed from anywhere and on any device. Desktops, laptops, tablets and mobile phones are all supported.

And, bringing even more convenience is the fact that you can collect signatures in person – directly on your own device. So even an in-person meeting can become paperless.

Eversign lets you sign from anywhere

Seamless Integration with Your Workflow

To make life even easier, eversign connects seamlessly with the apps you’re already using. Popular online applications like Box, Dropbox, Evernote, Google Drive, Microsoft OneDrive and more can all connect with your eversign account in just a few seconds.

From there, you’ll be able to import and export documents with the cloud service of your choice. Developers can also integrate eversign with their own custom systems via a straightforward JSON-based REST API.

Eversign integrates with apps you already use

Built for Your Business

No matter what kind of business you’re in, eversign can help. For example, you can make use of their templates for frequently used documents – like registration forms. You can also manage multiple businesses, each with their own set of team members and contacts.

Plus, eversign includes an audit trail that lets you see all the important details for each and every transaction.

Manage multiple businesses, team members and contacts

Get Your Free eversign Account

eversign has been built to make collecting electronic signatures both simple and secure. It not only meets all the strict security and authentication requirements defined in both the United States and Europe, the service will also seamlessly integrate into your existing workflow.

eversign is there to bring functionality and organization to an otherwise difficult aspect of doing business.

Sign up for your free eversign account today and see how it can benefit your business.

The post eversign Enables Electronic Signatures Anywhere, Anytime appeared first on Speckyboy Design Magazine.

Source: Speckyboy

How To Prototype IoT Experiences: Configuring The Software (Part 2)



In the first article of this series, we walked through how to put together the hardware board and all of its additional components into a single rig. I also gave you a glimpse of the decision-making process behind the selection of the board.

How To Prototype IoT Experiences: Configuring The Software (Part 2)

In this second (and last) article of the series, we will go over the code that will drive the sensor and the communication to the cloud. Additionally, we will configure a custom dashboard on Adafruit IO, so that we can visualize our data in real time.

The post How To Prototype IoT Experiences: Configuring The Software (Part 2) appeared first on Smashing Magazine.

Source: Smashing Magazine

20 Amazing Website Concepts with Breathtaking Typography

Despite the design you created for a website, whether the images, colors or sounds you choose, people immediately look at the text. People tend to look at the text to find what they are looking for and accomplish the purpose of opening the site. Knowing this fact, you need to pay more attention to typography in web design.

In this post I’ve have put together 20 amazing creative website concepts with breathtaking typography for your inspiration. Scroll down, enjoy the designs, and don’t hesitate to leave your feedback in the comment field below.

Bald Eagle Landing Page






Client Comp


Roney Gibson


Exploring The North Face


Teaori / Web site design


Trego Touring (guided bicycle tours)


Merge Virtual Reality


Columbia Clothing X Matterhorn – Expedition 2017




Minimalistic E-Commerce Website


Sportify App Landing Page


BMW Motorrad VISION NEXT 100 – website


Ambassador Page Layout


Dirtdays Trail Finder Concept


Cherry Blossom Landing Page


Green Chameleon Unused Home Screen


Step Inside Burma Live!


Gallery concept


Read More at 20 Amazing Website Concepts with Breathtaking Typography

Source: Web Design Ledger

Intro To Web Components: What They Are & How They Work

You’re reading Intro To Web Components: What They Are & How They Work, originally posted on Designmodo. If you’ve enjoyed this post, be sure to follow on Twitter, Facebook, Google+!

Intro To Web Components: What They Are & How They Work

Reusable code is the bedrock of modern web design. With every frontend framework and Sass library out there you can find solutions to any problem. But reusable dynamic elements are still a work in progress and they’re incredible. These elements are called Web Components and they rely on specs waiting to be finalized by the […]

Source: Designmodo

UX Design Process: Understanding Design Fundamentals

In this article you’ll learn about design fundamentals. We’ll talk about what a designer might want to express, and the visual decisions made to communicate the purpose of a design. 

Starting Point

good starting point is in understanding how to
put elements together to create effective composition, in order to aid visual

The elements are the “ingredients” of a design, and design principles guide how those elements fit together. Shape, color, size, and texture are some examples of design elements.

together elements in an effective manner has to do with understanding
several key principles in design:

1. Balance

Balance in design can be thought of as balance the
physical world. A large shape close to the center can be balanced by smaller
shapes on the edge of a page.

2. Contrast

Contrast involves putting opposites side by side (light
and dark, foreground and background, etc). It creates visual
interest and engagement which disrupts existing harmony in a design.

3. Proximity

Proximity creates a relationship between elements,
visually connecting them through a sense of “distance”.

4. Alignment

Alignment allows us to create order and unity. Aligning
elements visually connects them with each other.

5. Repetition

Repetition strengthens a design by tying together
individual elements. It helps to create association and consistency. Repetition
can create rhythm and continuation.

6. Space

Positive and negative space are very important in the realm of
design. Space is the distance or area between, around, above, below, or within

Up Next..

Having armed ourselves with the fundamentals of visual design, in the next article we’ll look at problem solving and testing. See you there!

Source: Webdesign Tuts+

Web Development Reading List #178: On CAA, Pong.js, And Meaningful Work



Looking at recent discussions, I feel that more and more people are starting to think about ethically and morally correct work. Many of us keep asking themselves if their work is meaningful or if it matters at all. But in a well-functioning society, we need a variety of things to live a good life. The people writing novels that delight us are just as important as those who fight for our civil rights.

Web Development Reading List #178: On CAA, Pong.js, And Meaningful Work

It’s important that we have people building services that ease other people’s lives and it’s time to set our sense of urgency right again. Once we start to value other people’s work, the view we have on our own work will start to change, too. As we rely on book authors, for example, other people rely on us to be able to buy the books via a nice, fast and reliable web service.

The post Web Development Reading List #178: On CAA, Pong.js, And Meaningful Work appeared first on Smashing Magazine.

Source: Smashing Magazine

Recital, a WordPress Theme to Complement Your Creativity

You’re reading Recital, a WordPress Theme to Complement Your Creativity, originally posted on Designmodo. If you’ve enjoyed this post, be sure to follow on Twitter, Facebook, Google+!

Recital, a WordPress Theme to Complement Your Creativity

Recital is a theme by Strict Themes aimed at bloggers, influencers, or artists, but will also be an excellent choice for anyone looking for a functional and streamlined WordPress theme. While it will fit many scenarios, the theme’s primary purpose is to showcase your creativity without distractions. Discovering Recital Theme The included dummy content will […]

Source: Designmodo

9 Graphic Design Trends You Need To Be Aware of in 2017


Here are 2017’s graphic design trends you need to follow. We are covering packaging trends, typography trends, layouts and even cinemagrahs.

2017 is the year we return to the organic roots and we will see a return to the natural. In terms of colors, the start has been given by Pantone (as every year, in fact), who has crowned the color for 2017 as Greenery, based on it’s meaning of new beginning, freshness and environmentalism.

Manifesting as a “fresh and zesty yellow-green shade that evokes the first days of spring”, Greenery envelops the notion of breathing, reinvigorating and appreciating the great outdoors.

That said, let’s take a closer look at the graphic design trends that define 2017. Most of them influence both print and web design, but some of them are just for the web.


Bright, Bold and Vibrant colors


In the past few years, many designers have used safe and easy to digest color schemes, in order to create very clean and controlled designs. We saw many lights and neutral colors like white, grays and black dominating the layouts. But in 2017 we expect bright, vibrant and bold colors. This trend has started earlier in 2016, through a variety of design elements, but it’s expected to really pick up its speed this year. As Pantone crowned the color of the year as Greenery, we expect to see the designers using more colors found in nature and intensifying them. With photography, the trend is to use bold and saturated images.


In terms of graphic design, this doesn’t mean that should be a color revolution in every company. But using bright colors with traditional neutral backgrounds, companies can give their branding a fresh new look without deviating too far from what they made great.      


Color transitions


Staying in the same register, the color transitions is one of the biggest design trends right now. Started in 2016 and rising quickly after, this trend is everywhere, from logo to buttons or picture overlays. As some of the big brands decided to change their logos and images from flat color to multi-colored transitions, we are expecting to see more companies adopting this trend, both for print and web design.    




Pattern and geometric shapes


This trend started in 2016 and it will definitely also continue in 2017. As flat design was a very welcome addendum to the graphics last year, helping to simplify the visuals and improve user experience, we expect to see it growing and expanding this year. I’ve stated at the beginning of this post that in 2017 will be a return to the natural, therefore, I’ll expect to see more nature-inspired patterns, like marble, precious stones and plants. Painterly patterns contrasted with simple typography will also bring a crafts vibe to printed media.




For packaging and brand design, bringing together the best qualities of flat design and pattern will create vibrant, colorful products, which feel both ultra-contemporary and artistic.

On the other hand, the pattern doesn’t have to be just about multiple colors or symmetry. Just bringing more visual to graphics using organic line pattern, will make the designs feel completely on-trend this year.





For those who love simplicity and functionality given by the minimalism, here is the good news: tracing its roots back to the early part of the 20th century, and for some, even further, minimalism is today more popular as ever. As the intentional white space means more breathability and reduced focal points, the simple way of communication of the message through design has led to adoption of the minimalism in many brand and design trends.  Inspired by Scandinavian design, ultra-minimal typography and layouts will still feel cutting-edge this year, and brands who opt for this visual approach will appear elegant and refined. If you need a touch of color, you should consider adding a subtle metallic foiling as the only embellishment you need, while keeping your palette restricted and strong.






Modern retro


By its very definition, modern-retro has been around for a while. Modern flare added to retro designs, typefaces and color palettes makes an interesting fusion of old and new. The key in this trend is both authenticities, as well as simplifying and modernizing any particular element that stood out from any time in the past. In 2016 we saw the popularity of modern-retro designs rising and finding its own way onto logo designs, print layout, web and packaging design. In terms of colors, maybe we’ll see some changes, meaning shifting from the muted browns and grays of 2016’s most vintage designs to candy colors. But for sure, the preference for this graphic design trend will continue to grow in 2017 and we haven’t seen all yet.retro-packaging-design


Modular layouts


Functioning to break up a text and put it into manageable chunks, modular isn’t a quiet new trend, but it’s popularity has increased in the last past years. Regardless if we are talking about print or web design, most times, using a long block of text is boring and you risk losing the readers. Especially for the web, the graphic designers have figured out that making the information more manageable makes more people interact with it. The modular design is not just a great management tool, but it also can look professional when it’s done well. We expect to see more modular layouts this year, both in print and web design.


modular design trends



Bold photography and sleek text


At this moment, this trend is pretty much a staple in the world of graphic designers, because the mix between bold photography and sleek text communicates a clear message without boring the audience.  “Bold and sleek” works very well both for people with a short attention span, as well as for those who don’t want to spend too much time looking for the main information and get straight to the point. If they are done well, the photography and text tend to work together and create some great contrast and brilliant borders, streaming class and excitement.     

This combination works great for display ads, social media promotions, and graphics where a small amount of information needs to be conveyed instantly.
typography trends 2017

Typography trends bold




Cinemagraphs are an incredible, simple and effective answer to one of the marketing’s toughest problem: time. As marketers should do and use every possible tool to grab the audience’s attention in a very short and exciting way, cinemagraphs are the perfect tool for doing this. They aren’t the regular gifs we see all around the web. Cinemagraphs are still images with minor element moving in them. This technique makes simply photos look more realistic and bring them to life. With more and more competition between marketers, we expect to see cinemagraphs coming to screens in 2017.



cinemagraphs design trends


Material design

Material design may be the biggest and boldest of the design trends of this year. Google has created this style guide trying to simplify the way designers design and users interact with the Internet. The core concepts of this trend are “material as a metaphor; bold, graphic, intentional; and motion provides meaning.”

This means the visual aesthetic communicates clearly with the user. By drawing inspiration from real-world materials—particularly paper and ink— the designs are grounded in reality, yet lightweight and minimalistic. Paper is tactile, casts shadows, but is also incredibly flexible, so, designing with these principles in mind, you’re weaving together the fabric of the Internet and add depth to your design.

By using bold colors, contrast and typography in your design, you should guide the user’s behavior and influence your audience to act the way you desire. Google’s Material Design aesthetic is very similar to Flat Design 2.0, but it takes intentionality to another level.




Have we missed something? Let us know in the comments bellow.
Also, check these awesome web design trends to be aware of in 2017.


Read More at 9 Graphic Design Trends You Need To Be Aware of in 2017

Source: Web Design Ledger

Sass to CSS: How to Preserve Whitespace on Compile

Ever wanted to keep the visual structure of your Sass files, when you compile to CSS, without losing any of the whitespace? In this quick tip I’m going to show you how!

Watch Quick Tip


This quick tip is for those of you who need to compile Sass to an “expanded” form. If you compile to “compressed” or “minified” then the whole question of there being whitespace is irrelevant.

The Problem

Imagine you have several Sass partials which are formatted like this, including the empty line breaks at the bottom:

Compiling them under normal circumstances would give you something like:

But let’s say you actually want the following:

The Solution

We’re going to solve things by using a Grunt plugin called grunt-replace. For details on how to get up and running with Grunt, take a look at the following resources:

We load grunt-replace, along with some other dependencies, in our package.json file as shown in the following snippet:

Then, in our grunt.js file we have to implement the task:


We apply the replace task after we’ve compiled our Sass file (check out the source files for more details).

Notice the patterns option, which shows the following:

This instructs Grunt to go through the compiled file, find instances of /**/ and replace them each with an empty string. Now all we need to do is go through our Sass partials, place these /**/ comments wherever we actually want whitespace, and let Grunt do the rest:


Grunt-replace is a really useful task for finding common strings and replacing them with something else, whenever your run Grunt. In this case it’s the perfect tool to prevent whitespace from being stripped out of our compiled Sass. What else would you use it for?

Useful Resources

Source: Webdesign Tuts+