New Course: Introduction to Text Masking on the Web
Text masking (also known as “knockout text”) is a technique that allows us to display images, gradients, patterns, and even videos inside the shape of a piece of text. There are a few ways of achieving this effect, and in our new short course, Introduction to Text Masking on the Web, you’ll learn five of them.What You’ll LearnIn this quick half-hour course, Adi Purdila will show you five different ways of creating text masking effects on the web.
You'll learn the following methods:
using blend modes
using blend modes for cutouts
using SVG text
using SVG masks
By the end of the course, you'll be confident in your ability to create text masking, and you'll have learned some useful techniques that you can apply in your future projects.Watch the Introduction Take the CourseYou can take our new course straight away with a subscription to Envato Elements. For a single low monthly fee, you get access not only to this course, but also to our growing library of over 1,000 video courses and industry-leading eBooks on Envato Tuts+. Plus you can download unlimited items from the huge Envato Elements library of over a million creative assets. Create with unique fonts, photos, graphics and templates, and deliver better projects faster.
How to Create an Online Store with WordPress and BigCommerce
In this tutorial I’m going to show you how to make a WordPress shopping cart, using the BigCommerce WordPress plugin. We’ll go over the following things (in both video and written format, choose whichever you prefer!):What is BigCommerce (and the concept of “headless”)?How to download the plugin and create an accountSetting up the WordPress storeHow to create a menu for the storeProducts on the BigCommerce platformWatch the Screencast
Read the TutorialLet’s begin by answering this question:1. What is BigCommerce?BigCommerce is an eCommerce platform which powers over fifty thousand small and medium sized businesses, and over thirty thousand Fortune 1,000 companies (like Ford, Toyota, and Sony). BigCommerce is a SaaS product (software as a service) so is licensed and accessed via entirely online.What makes BigCommerce different is its “headless” commerce approach. Being headless means that the presentation layer (what is seen by the user) is decoupled from the ecommerce layer. A traditional online store will usually be run on a system where the frontend is directly linked with the backend; everything is served from the same place. A headless system means that the frontend can be located wherever, and talks to the remote commerce layer via an API.BigCommerce offer a “frontend” just like any other eCommerce service, but thanks to their headless approach you can also choose...
14 Best BuddyPress WordPress Themes: To Make Social & Community Sites
Small business owners are busy. Their task list seems never-ending, so it stands to reason that they could use as many tools as possible to make their daily lives easier. One such tool comes in the form of a WordPress plugin that many web designers or business owners themselves would overlook as non-essential. But the truth is, this one plugin could save you hours of time each week, and even allow you to build a community around your website.Use BuddyPress to extend WordPress’s community functionality.
The plugin in question is BuddyPress. In a nutshell, BuddyPress allows you to build your own social network—and it’s quite flexible to work with for building a variety of community sites.
You can use it to build a small business website, leveraging BuddyPress to develop a collaborative space between you and your coworkers. Having a dedicated company network allows you and your team to have an immediate overview of who is doing what and make sure every project is on track.
And, if you’re a solopreneur, or want to provide an easy way for your clients to get in touch with you, you can use all the features BuddyPress has to offer to facilitate collaboration and offer immediate support. By giving them an easy means of communication, you can greatly improve visitor engagement and grow your website’s audience.
What Features Should a BuddyPress Theme Have?
It goes without saying...
CSS Subgrid: Features, Syntax, and the Problem It Will Solve
CSS subgrid is slowly making its way into browsers. The CSS Working Group is actively working on it and the related W3C specification has already reached Level 2. This new feature will enable us to enhance grid items with subgrids that inherit the grid tracks of their parent grid and seamlessly align with it.As CSS subgrid is not yet implemented by browsers, this article gives only a high-level overview of the upcoming features. Subgrid will likely to be implemented by Firefox Nightly soon where you can experiment with it. Note that the specifications are not yet finalized, so features can still change in the future.The Problem CSS Subgrid Solves: InheritanceOnly direct children of the grid container become parts of the CSS grid layout. Children of grid items don’t inherit the grid layout. Instead of display: grid, their default display property will be either block or inline, depending on whether they are block or inline elements.Grandchild elements not being part of the grid does have several advantages. For example, they’re free to implement another layout module, such as flexbox, or their own independent grid with different alignment rules.However, in many cases, you might want to create a subgrid that inherits rows, columns, and lines from the parent grid. Using the more precise wording of the CSS Working Group:“... a subgridded axis is one which matches up its grid lines...
AMP as your web framework
Update (5/2/2019): Added a paragraph to clarify compatibility with other frameworks (to not suggest a zero-sum game), and removed some language on how AMP was misunderstood that wasn’t needed to get the point across.
Read a blog post comparing popular frameworks lately? Participated in a frontend tooling survey? I can almost guarantee that AMP was not on the list. Which strikes me as odd, considering the millions and millions of domains running it. So, how come?
Here’s the content of this blog post in super over-produced video form. You should watch this. Trust me. It’ll be worth it.
How we got here: HTML vs. JS Frameworks, perception as distribution format, and paired AMP
The second reason is that many compare AMP to RSS, and the media positioned it as competitor to certain other big companies’ walled garden media formats. That narrative certainly didn’t help, and for what it’s worth, we, the AMP team, never loved that comparison (but we also did our part...
How to Create a Wiki-Style Website With WordPress, Quickly
Whether you’re a growing business or already several years in existence, there is no denying that you should have a system in place for answering your customers’ most pressing concerns. Documenting your processes and providing easy access to frequently asked questions is a great way to help both your customers and your employees.
If you’re still using files and folders, it’s time to modernize your business and consider adding a wiki to your existing website. A wiki-style website can facilitate new employee training and help them learn the ropes quickly. It can also serve as a customer support center and reduce the number of support questions you receive on a daily basis.
All things considered, when your employees know where to find information about your business and when you can direct customers to an answer to their problem, your staff can spend more time focused on nurturing customer relationships so your business can thrive.In this post, you’ll learn how to quickly create a wiki-style website using one of our best wiki knowledge base WordPress themes.
Wiki knowledge base WordPress themes on Themeforest
What You’ll Need to Get StartedBefore you build your actual knowledge base, there are a few things you need to do. The most important thing to consider is how you want to integrate the knowledge base into your existing website.1. Choose a Knowledge Base Integration...
New Course: Creating Custom Presentation Themes for Reveal.js
Reveal.js is a powerful HTML framework used to create presentations. In our new short course, Creating Custom Presentation Themes for Reveal.js, you'll learn how to use the framework to create your own themes from scratch.What You’ll LearnReveal.js comes with a lot of default themes you can choose from, but sometimes you will want to create your own.In this short course, Adi Purdila will show you how to do just that. You’ll learn how to install Reveal.js and, step by step, how to create a custom theme for it.The course will show you how to set the typography and colours, set up custom scaling, position the footer and other layouts, and more.Watch the Introduction Take the CourseYou can take our new course straight away with a subscription to Envato Elements. For a single low monthly fee, you get access not only to this course, but also to our growing library of over 1,000 video courses and industry-leading eBooks on Envato Tuts+. Plus you can download unlimited items from the huge Envato Elements library of over a million creative assets. Create with unique fonts, photos, graphics and templates, and deliver better projects faster.
15+ Best WordPress Corporate/Business Themes for Entrepreneurs
A website is essentially your home on the web, so it makes sense that a business needs to invest properly in this area to ensure it projects a professional appearance. For instance: A consultant needs to convey their expertise and a corporate-looking website will project that confidence. A lawyer needs to offer a complete rundown of their services and a website with stylish services widget will accomplish this. Someone working in PR needs to feature their best clients with killer testimonials; appropriate use of a slider will get the job done.
The point here is, small business owners and entrepreneurs can benefit tremendously from having a well-designed, professional website. And as a web designer, it’s your job to build a quality website for your clients—on time and on budget.
Utilizing professional WordPress business themes is one of the best means to that end. They have the quality coding, reliable features, and flexible designs, a new website demands.Great WordPress business themes like the best-selling Avada (shown above) have powerful design features.
What to Look for in a High-Quality WordPress Business Theme?
ThemeForest offers a robust and up-to-date selection of WordPress themes across a wide number of niches. Themes span the gamut of topics from business to legal; music to gardening; corporate to marketing. And that’s why figuring out what...
How to Make Modern Websites With Clean WordPress Themes
Creating a website has never been easier thanks to platforms like WordPress. Not only is WordPress very easy to learn, it’s the perfect platform to create any type of website. Thanks to the huge number of themes, you can get your site up and running in a matter of hours, whether you want to launch your business site, make an outstanding portfolio, or start a personal blog.If you want to make a clean and modern website, WordPress has you covered. Clean WordPress themes are a great choice for almost any business because of their simplified design that directs attention to the content. They make it easy for your visitors to focus on products and services, and can help convert more visitors into clients and customers.Clean and modern WordPress themes available on ThemeforestJust some of the modern homepage design options in Clean Roneous WordPress theme.Another benefit of clean WordPress themes is the fact that the simple design (usually) leads to better loading times which means your visitors won’t have to wait for ages for your site to load.Finally, a clean WP theme can help businesses land more clients but also bloggers who are looking to grow their email list. Discover the best, trending WordPress themes with clean designs:WordPress
25+ Clean WordPress Themes: To Make Modern Websites in 2018
Brenda BarronBeginner’s Guide to Using WordPress (Free Course)If you’re just starting...
Tips for Using Location-Based Photos on Your Website
Photography can be one of a web designer’s most powerful assets. We
can use it to transport users to another place and time. It can convey a feeling and amplify a message.
Today, we’re going to focus on images that were taken on location.
This can cover anything from a stunning skyline shot of New York City
to a nondescript photo of a dirt road. Whether specific or generic,
these types of images can play an important role in the overall design
and content strategy of a website.
Along the way, we’ll show you some different techniques for
utilizing location-based photos to enhance your site. We’ll also share some stunning images that are available with your subscription to Envato Elements. Home to nearly 700,000 stock photos, Elements provides you with unlimited access to a variety of top-quality design assets.
Ready to get started? Our journey around the world begins…now!
1. Create the Perfect Mood
A great photograph provides context for your content. Consider a
featured image at the top of a blog post. With just one look, a user can gain a sense of what they’re about to read. It doesn’t necessarily
have to be an exact reflection of the subject matter. Rather, it’s
about setting the tone for what’s to come.
Perhaps no city on earth better sets a tone than Paris, France. And with Feet of couple kissing near Eiffel tower, the spirit of romance will be...
How to Make a Great Writer Portfolio Website With WordPress
Freelance writing can be a lucrative career, but in order to get started as a freelance writer you will need a portfolio that showcases your work. There are plenty of websites that specialize in providing a portfolio platform for freelance writers, but the fact remains that nothing beats a self-hosted website.When you choose one of the hosted solutions, you’re putting your content into the hands of someone else. And if they decide to shut down their platform, you could lose access to all your content.With a self-hosted website, you’re in complete control. You own your site and everything on it, along with the domain name. You can choose how your website looks, where it’s hosted, and if you decide you aren’t satisfied with your host, you can literally take your website and move it to a different hosting provider.Creating your own portfolio may seem intimidating, especially if you’re not tech-savvy. And if that’s what’s stopping you from finally taking the plunge, you’re in luck. In today’s article, we’ll show you how to create a great portfolio website with WordPress, give you pointers on what your website should include and how to effectively promote it so you can land more freelance writing gigs!Writer from 8 Office IllustrationsWhat Should Your Portfolio Website Include?Before actually setting up your writer portfolio, it’s time to do some planning and decide on the...