Thursday, October 31, 2019

Facebook Files a Copyright Lawsuit Against Two Web Hosts; Demands Hefty Amount for Damages!

In an exciting turn of events, Facebook is now the one filing a lawsuit. According to the copyright lawsuit in question, the social media giant has blamed two domain hosts (OnlineNIC and ID Shield) for trademark infringement and cybersquatting. According to Cnet, the lawsuit was filed in the US...

[ This is a content summary only. Visit our website https://ift.tt/1b4YgHQ for full links, other content, and more! ]

by Ali Siddiqui via Digital Information World
Posted by at No comments:
Labels:

Link Hover Style 87

The post Link Hover Style 87 appeared first on Best jQuery.


by Admin via Best jQuery
Posted by at No comments:
Labels: , , ,

Pagination Style 62

The post Pagination Style 62 appeared first on Best jQuery.


by Admin via Best jQuery
Posted by at No comments:
Labels: , , ,

How to Build a Web App with GraphQL and React

In this tutorial, we'll learn to build a web application with React and GraphQL. We'll consume an API available from graphql-pokemon and serve it from this link, which allows you to get information about Pokémon.

GraphQL is a query language for APIs and a runtime for fulfilling those queries created by Facebook. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.

In this tutorial, we'll only learn the front end of a GraphQL application that makes use of Apollo for fetching data from a ready GraphQL API hosted on the web.

Let's get started with the prerequisites!

Prerequisites

There are a few prerequisites for this tutorial:

  • recent versions of Node.js and npm installed on your system
  • knowledge of JavaScript/ES6
  • familiarity with React

If you don't have Node and npm installed on your development machine, you can simply download the binaries for your system from the official website. You can also use NVM, a POSIX-compliant bash script to manage multiple active Node.js versions.

Installing create-react-app

Let's install the create-react-app tool that allows you to quickly initialize and work with React projects.

Open a new terminal and run the following command:

npm install -g create-react-app

Note: You may need to use sudo before your command in Linux and macOS or use a command prompt with administrator rights if you get EACCESS errors when installing the package globally on your machine. You can also simply fix your npm permissions.

At the time of writing, this installs create-react-app v3.1.1.

Creating a React Project

Now we're ready to create our React project.

Go back to your terminal and run the following command:

create-react-app react-pokemon

Next, navigate into your project's folder and start the local development server:

cd react-pokemon
npm start

Go to http://localhost:3000 in your web browser to see your app up and running.

This is a screenshot of the app at this point:

The current state of our app

Installing Apollo Client

Apollo Client is a complete data management solution that's commonly used with React, but can be used with any other library or framework.

Apollo provides intelligent caching that enables it to be a single source of truth for the local and remote data in your application.

You'll need to install the following packages in your React project to work with Apollo:

  • graphql: the JavaScript reference implementation for GraphQL
  • apollo-client: a fully-featured caching GraphQL client with integrations for React, Angular, and more
  • apollo-cache-inmemory: the recommended cache implementation for Apollo Client 2.0
  • apollo-link-http: the most common Apollo Link, a system of modular components for GraphQL networking
  • react-apollo: this package allows you to fetch data from your GraphQL server and use it in building complex and reactive UIs using the React framework
  • graphql-tag: this package provides helpful utilities for parsing GraphQL queries such as gql tag.

Open a new terminal and navigate to your project's folder, then run the following commands:

npm install graphql --save
npm install apollo-client --save
npm install apollo-cache-inmemory --save
npm install apollo-link-http --save
npm install react-apollo --save
npm install graphql-tag --save

Now that we've installed the necessary packages, we need to create an instance of ApolloClient.

Open the src/index.js file and add the following code:

import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { HttpLink } from 'apollo-link-http';

const cache = new InMemoryCache();
const link = new HttpLink({
  uri: 'https://graphql-pokemon.now.sh/'
})

const client = new ApolloClient({
  cache,
  link
})

We first create an instance of InMemoryCache, then an instance of HttpLink and we pass in our GraphQL API URI. Next, we create an instance of ApolloClient and we provide the cache and link instances.

Connect the Apollo Client to React Components

After creating the instance of ApolloClient, we need to connect it to our React component(s).

We'll use the new Apollo hooks, which allows us to easily bind GraphQL operations to our UI.

We can connect Apollo Client to our React app by simply wrapping the root App component with the ApolloProvider component — which is exported from the @apollo/react-hooks package — and passing the client instance via the client prop.

The ApolloProvider component is similar to React's Context provider. It wraps your React app and places the client in the context, which enables you to access it from anywhere in your app.

Now let's import the ApolloProvider component in our src/index.js file and wrap the App component as follows:

The post How to Build a Web App with GraphQL and React appeared first on SitePoint.


by Ahmed Bouchefra via SitePoint
Posted by at No comments:
Labels: , , , , , , , ,

Zuckerberg and Former Facebook Exec Spar Over The Social Network’s Initial Purpose

While Facebook has managed to weather the obstacles that came in its way as a lot of people started to mistrust it after the Cambridge Analytica scandal, its CEO Mark Zuckerberg has not really been able to find quite as much success in swaying the favor of the public towards himself. While he has...

[ This is a content summary only. Visit our website https://ift.tt/1b4YgHQ for full links, other content, and more! ]

by Zia Muhammad via Digital Information World
Posted by at No comments:
Labels:

ADning Advertising: Create Adverts For Your WordPress Site

Advertising is one of the main ways that websites generate revenue.

Perhaps you created a blog specifically to drive people towards your website’s Store page, and want to give visitors that extra little push? Maybe you run several websites, and want to promote your biggest-earner across your entire portfolio? Or maybe you don’t have anything to promote, but wouldn’t mind generating some cash by selling advertising space to third parties? 

Despite the money-making potential, WordPress doesn’t support advertisements out-of-the-box. Most WordPress themes don’t even have space where you can display ads!

If you dream of turning your website into an additional source of revenue, then you have two options: dig into your theme’s files and modify its code to support adverts,or let a plugin do all the hard work for you! 

In this article, I’ll show you how to create a range of adverts and display them across your website, using the popular ADning Advertising plugin. To help ensure your ads generate as many click-throughs as possible, we’ll be using ADning to display customized ads based on factors such as the visitor’s geographical location, and the time of day. Finally, I’ll show how to monetize your website even if you don’t have anything to promote, by selling advertising space to third parties. 

Getting Started With the ADning Advertising Plugin 

The first step, is installing the ADning Advertising plugin: 

If you haven’t already registered, create your free Envato Market account.
 Head over to the CodeCanyon website, click the little Sign In button in the upper-right corner, and then enter your Envato account details.
 Once you’re logged into your account, head over to the ADning Advertising listing, click Buy Now and then follow the onscreen instructions to complete your purchase.  


When prompted, download the ADning plugin. 
Unzip the downloaded file; the subsequent folder should contain several folders and files, including angwp.zip, which you’ll need to upload to WordPress.


Adding a Third Party Plugin to WordPress

Once you’ve downloaded the ADning Advertising plugin, you’ll need to upload it to your WordPress account:

Log into WordPress, if you haven’t already. 
Select Plugins from WordPress’ left-hand menu, followed by Add New.
Select the Upload Plugin button.
 

Now scroll to the If you have a plugin in a .zip format section, and select Choose file.
Select your angwp.zip file and click Install Now. 

ADning will now be uploaded to your WordPress account. After a few moments, a new ADning item should appear in WordPress’ left-hand menu. 


Install the ADning WordPress plugin
Activating the ADning Advertising Plugin 

Next, you’ll need to active ADning, by entering your license key:

Head over to the CodeCanyon website and log into your account.
 Select your username in the upper-right corner, followed by Downloads.
 Find the ADning Advertising item, and select its accompanying Download button.
 Choose License certificate & purchase code from the dropdown menu. 


Once your license has downloaded, open it and find your Item purchase code. You'll need to copy this information then, in your WordPress account, select ADning from the left-hand menu. Select the Product License tab and paste your purchase code into the Add your license key here field.
 

Finally, click Activate ADning. After a few moments, you should see a Plugin activated successfully message. Your plugin is now ready to use! 


Placing Adverts on Your Website

In this section, we’ll be placing four different styles of adverts on our WordPress website:

  • A banner ad that’ll run along the top of the page. 

  • An embedded banner that’ll be displayed inside the page’s content.

  • A popup ad.

  • An “injected” advert that’ll be displayed on a line specified by you. 


To create these ads, I’ll be using a graphic that promotes Envato Elements, but you can use any graphic you want. 

Creating Your First ADning Ad

To display an advert, we need to create: 

  1. A banner, which is essentially the graphic that we want to use.

  2. A campaign, which sets a start and an end date for your advert.

  3. An Ad Zone, which defines where your banner will appear on the page, and the kind of advert that’ll be displayed to the visitor, such as a popup or a vertical banner.


We then need to link these three components together, and insert the finished advert into our website using either shortcode or a widget. 

While this may seem like a lot of setup just to display a single ad, you can re-use these elements multiple times, for example you may decide to run multiple adverts as part of the same campaign, or use the same Ad Zone for all your banners.

Turn Any Image Into a Banner 

Let’s start by creating a banner, using a graphic of your choice. Note that depending on the dimensions of your chosen graphic, you may need to play around with the common advertisement settings in order to create an advert that looks good and functions correctly. 

Select Banner from WordPress’ left-hand menu and click Add New Banner. 
Under Title give this banner a descriptive name; I’m using Elements banner.
 In Add a banner link, enter the URL that your banner should link to; I’m using the Elements website.
 

Now open Target and specify the window where the destination URL should load, for example in a new tab or inside the current advertising frame. If you’re linking to an external website, then you’ll typically load the URL in a new tab or window, because you don't want to encourage visitors to navigate away from your website. 

Specify where the embedded URL should load

Find the Select one of the common banner sizes section and open its accompanying dropdown. Here, you’ll find some of the most commonly used advertising styles and sizes, such as vertical banner, pop under and full banner. Select the banner style and sizing that best represents the advertisement you want to create, or select Custom and then specify an exact size in pixels. Note that this step may require some trial and error! 


Select Click here or Drag file to upload and then choose the graphic that you want to use. 
Find the Auto Positioning section and specify where your banner should appear on the page. Since I want to display this banner along the top of the screen, I’m selecting Above content. 


Position the adverts on your WordPress website

Scroll to Alignment and then choose from left, right or center alignment; I’m using Center. 


When you’re happy with the information you’ve entered, select Save Banner. 


Create Your First Advertising Campaign

Next, we need to create a campaign. This campaign will dictate the date and time when the advertisement will first appear on your website, and when it’ll disappear: 

Select Campaigns from WordPress’ left-hand menu, then select Add New Campaign.
 Give this campaign a descriptive Title; I’m using Elements campaign.

In the Start Date section, enter the month, day, year and time when this campaign should start. To make it easier to test your advert, you should choose either the current date and time, or backdate the advert so it’ll appear on your website immediately. 
Click to expand the End date section, and then choose the date and time when this campaign should end, at which point the associated advert(s) will disappear from your website.
 

When you’re happy with your changes, select Save Campaign.


Make Space for Your Advert: Creating an AD Zone 

Finally, we need to create an AD Zone, which is the region of the page where we’ll display our advert. Once we’ve created an AD Zone, you can re-use that zone for subsequent adverts:

Select AD Zones from WordPress’ left-hand menu and click Add New AD Zone. 


Give the AD Zone a descriptive Title; I’m using Elements AD Zone.
 

Find the Select one of the common banner sizes section, and open its accompanying dropdown. Here, you’ll find some common advertisement sizes, such as vertical banner, pop under and full banner. Select the option that best represents the banner you’re placing within this AD Zone. Alternatively, you can select Custom and then specify the exact dimensions. 


Now, open the Linked banners dropdown and select the banner we created in the previous step. 
Open the Campaign dropdown and select the campaign.  
Scroll to the Alignment section and choose how you want to position this AD Zone onscreen; I’m selecting Center.


Once you’re happy with the information you’ve entered, select Save AD Zone.

Connect Your Components

Now we've created all three components, we just need to link our banner to our campaign and AD Zone: 

  • Select Banners from WordPress’ left-hand menu.

  • Find the banner that you previously created and click its accompanying Edit link.

  • Open the Campaigns dropdown and select your campaign. 

  • Open Adzones and select the AD Zone you created in the previous step.

  • Select Save banner.

Displaying Your Advert

Now we have all three of our components, we’re ready to place the advert on our website using either an ADning widget or shortcode. Let’s explore both options: 

1. Use a Widget

One option, is to place a widget on your website and then assign it an appropriate AD Zone and banner:

In WordPress’ left-hand menu, select Appearance > Widgets. 
Click to expand the ADning ADS section and select Add widget. 

Open the Select a banner dropdown and choose the banner that you want to display. 
Open Select an Adzone and then select the AD Zone that we created earlier. 
Click Save. 


Now, load any WordPress page or post, and your banner should appear at the top of the screen. 

Create a banner advert with ADning Advertising

Give this banner a click to make sure it links through to your chosen URL in either a new tab, window or within the current advertisement frame, depending on how you’ve configured your banner. 

Note that at this point you may need to spend some time tweaking your banner style and sizing, depending on your original graphic, how you chose to position that graphic, and your website’s theme. 

2. Copy and Paste the Shortcode

Alternatively, you can display the finished advert using shortcode. I'll use a shortcode to display the advert in a widget.

Select AD Zones from WordPress’ left-hand menu. Then find your AD Zone and click its accompanying Edit link.


Scroll to the Export section; this should contain a block of shortcode. Copy all of this code.


In WordPress’ left-hand menu, select Appearance > Widgets. 
Click to expand the ADning ADS section.
 Select Add widget. 
Paste your shortcode into the Or add the adzone shortcode section.


Copypaste your adverts shortcode into the Add the adzone shortcode section

When you're done, click Save. 


Once again, load any page or post that makes up your website, and your banner should appear onscreen. 

What Other Ad Styles Can I Use? 

ADning Advertising supports a wide range of different advertising styles. In this section we’ll be exploring a few simple ways that you can modify our existing banner to create a completely different style of ad. 

Creating Embedded Ads 

Let’s start by moving our banner from the top of the page and embedding it within our webpage’s content.

Every time you create an embedded ad, you have the option to repeat this advertisement at regular intervals, for example once every five paragraphs. 

If your website contains large amounts of text, then an occasional embedded advert can be more appealing than a solid wall of words—just don’t get carried away! Remember that some visitors may be viewing your website on the smaller screen of a smartphone or tablet, where each advert could potentially take up their entire screen, forcing them to scroll to find the content they’re actually interested in.  

You can embed multiple ADning adverts in your WordPress content

To turn our banner into an embedded ad: 

Select ADning > Banners from WordPress’ left-hand menu.
 Find the banner that you want to edit and select its accompanying Edit link.


Scroll to the Auto Positioning section and select the Inside content thumbnail, which will give you access to a new Custom Placement Settings section. 
Specify where your advert should appear, using the After x paragraphs field.
 Optionally, you can turn this advert into a repeating advert by clicking the Repeat slider so that it changes from No to Yes. If you select Yes, then your advert will repeat at the interval defined in the After x paragraphs field.


When you’re happy with your changes, click Save Banner.

Custom Classnames: Control Exactly Where You Ad Appears

Would you like more control over where each advert appears? Perhaps you want to position an advert next to a relevant paragraph, or maybe pick-and-choose which advert appears on each webpage? 

You can control the page, paragraph, and even the line where your advert appears, by creating one or more custom classnames, and then assigning each classname to an advert. Then, you just need to insert the correct custom classname into your website’s HTML, and the associated advert will appear in that exact spot. 

Using the Widget Options Plugin

You can create custom classnames quickly and easily using a dedicated plugin; I’m opting to use the free Widget Options plugin.

You can install this plugin from the WordPress plugin directory. To setup it up, just select Plugins > Add New from WordPress’ left-hand menu.
 Search for Widget Options.
When the correct plugin appears, select Install Now.


Install the free Widget Options plugin

Once the plugin has been installed, click Activate.

Creating Custom Classnames

Next, we need to create a custom classname. Depending on your setup, you might decide to create a single classname for a specific advert, a different classname for each advert, or a single classname that you’ll use across all of your adverts. 

To help keep things simple, we’ll be creating a single classname:

In WordPress’ left-hand menu, select Settings > Widget Options. 


Find the Classes & ID section and select Configure settings.
 Select the Enable ID Field checkbox. 


You can now use the Predefined Classes field to create a list of all the custom classnames that you want to use. Type each classname into the field and then press the + button.


When you’re happy with the information you’ve entered, click Save Settings.


Next, select Appearance > Widgets from WordPress’ left-hand menu. 
Click to expand the Adning ADS section.


Create custom CSS classnames using ADning ADS

Select the little cog icon, which opens the Settings tab.


Navigate to ADning ADS Settings

Select the Class & ID tab. 
The Class & ID tab should contain a list of all the custom classnames that you can use with ADning; select the classname that you just created and click Save.


Assigning Custom Classnames

Next, we need to assign this custom classname to our advert: 

Select ADning > Banners from WordPress’ left-hand menu.
 Find our advert, and then select its accompanying Edit link.
 Scroll to the Default AD placements section and select Inject before/after class. 


In the Custom Placement Settings section, open the Where dropdown and specify whether your advert should be placed Before or After the point where you insert the classname into your HTML. Note that it may not be immediately clear which option will work best for your particular website, but you can always return to this page and modify the Before/After setting later. 


In the Element field, type the classname that you want to associate with this advertisement and when you're done you can click Save Banner.


 Editing Your Website's HTML

Now, we can place this advert anywhere on our website, by inserting the custom classname into our HTML: 

  • Find the page or post where you want to display your advert, and open that item for editing.  

  • Click to select the block where you want to place your ad; a little floating toolbar should appear.

  • Select the three-dotted icon, followed by Edit as HTML.
Edit your chosen page or post as HTML

You can now add your custom classname to any of the page or post’s HTML tags. For example, imagine I’d created an elementsAd custom class and wanted to place my advert before the following block: 

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Duis id tincidunt turpis. Pellentesque neque magna, egestas 
quis orci a, luctus pretium tellus. Donec egestas enim massa, 
sed pellentesque massa tempus in.</p>

In this scenario, I’d add class="elementsAd" to the opening <p> tag: 

<p class="elementsAd">Lorem ipsum dolor sit amet, 
consectetur adipiscing elit. Duis id tincidunt turpis. 
Pellentesque neque magna, egestas quis orci a, luctus 
pretium tellus. Donec egestas enim massa, sed 
pellentesque massa tempus in.</p>

Insert the custom classname in your chosen location, then save your changes and navigate to the page or post in question. Your advert should have appeared, at the point where you inserted the custom classname. 

Create a Popup Ad

ADning Advertising also supports popup advertisements, which by default appear every time a visitor navigates to a new page.

To convert our banner ad into a popup:

  • Select ADning > Banners from WordPress’ left-hand menu.

  • Find the banner that you want to modify and click its accompanying Edit link.

  • Scroll to the Auto positioning section, and then select Popup/Sticky. 

  • In the Custom Placement Settings section, use the thumbnails to select where this popup should appear onscreen; I’m using Bottom/Center. 

  • Click Save Banner.

Now, whenever you navigate to a new webpage, a popup advertisement will appear. 

Create a popup ad with ADning also known as a sticky ad

Immediately, this poses a problem: no-one wants to be confronted by a popup every single time they navigate to a new page! Conveniently, this leads us onto our next topic. 

Control Where Your Ads Appear 

If a visitor encounters the exact same ad on every single post and page across your site, then in the best case scenario that advert is quickly going to become invisible to them.

In the worst case scenario, the visitor will get so frustrated that they’ll navigate away from your website, especially if you’re using intrusive adverts such as popups.

Often, you’ll want to set some restrictions about where each advert can appear, and ADning gives you several options:

  • Select ADning > Banners from WordPress’ left-hand menu.
  • Find the banner ad that you want to edit, and then click its accompanying Edit link.

From here, you can set the following restrictions.

Ban This Advert From Your Home Page

Your home page is often a visitor’s first impression of your website, and a page full of adverts isn’t exactly a great first impression!

To prevent this advert from appearing on your home page, find the Home page section and click its accompanying Show/Hide button, so that it displays Hide.

Ban this advert from your home page by toggling the ShowHide toggle

Don’t Display This Ad on Smartphones or Tablets

The smaller screen of a smartphone or tablet can make a webpage feel much more ad-heavy than it actually is. Since mobile users typically have a much lower tolerance for ads, you may want to reduce the number of adverts that appear on mobile devices.

You can block this advert from smartphones or tablets, or both, using the Show/Hide toggles in the Device Filters section. 

Prevent this advert from appearing on smartphones and tablets

For example, if you wanted to prevent this advert from appearing on smartphones, then you’d find the Mobile section and toggle its accompanying button to read Hide. 

Block This Ad From Specific Pages and Posts

You may want to ensure that a few webpages remain completely ad-free, for example if there’s a page where an ad would be inappropriate, or you simply want to give your visitors a break!

You can use ADning to name specific pages and posts where this advert should never appear:

  • Scroll to the For page section.
  • Click the Show/Hide button so that it reads Hide.

In the accompanying field, start typing the name of the page or post in question, and then select it from the dropdown menu when it appears.

Ban your advert from named WordPress posts and pages

Display This Ad on the Named Page Only

If you only want to display this advert on a small number of pages and posts, then it may be easier to simply name the webpages where this advert should appear:

  • In the For page section, click the Show/Hide button so that it reads Show.
  • Enter the name of the page or post where this advert should appear, and then select it from the dropdown menu. 

You can repeat the final step, until you’ve named all the webpages where this ad should make an appearance.  

Drive User Engagement With Customized Ads 

You can encourage visitors to interact with your ads by delivering customized content. ADning gives you the option to tailor your ads based on the visitor’s geographical location, and the date and time when they’re viewing the advert.

Filter Content by Country

There’s lots of reasons why you might display different adverts, depending on the visitor’s location. 

You may be able to encourage visitors to engage with your ads, by targeting their location, for example displaying ads that relate to national holidays such as Canada Day, Chinese New Year or St. Patrick’s Day. Since your website has the potential to reach a global audience, you should also consider that some of your ads may be deemed inappropriate, or even offensive in certain parts of the world.

To display ads based on the visitor’s location: 

  • Select ADning > Banners from WordPress’ left-hand menu.
  • Find the banner that you want to edit, and then click its accompanying Edit link.
  • Scroll to the Country filters section.

From here, you can block this advert for specific countries:  

  • Press the Show/Hide button so that it changes to Hide. 
  • In the accompanying text field, enter the country, or countries where your advert shouldn’t be displayed. 

Alternatively, if this ad is only relevant for a small number of countries, then it may be easier to simply name these locations:  

  • Toggle the Show/Hide button so that it reads Show. 
  • Specify every country where you want to display this ad. 

Display Ads Based on Date and Time

Your visitors may be more likely to interact with an advert at a certain date or time. For example, you may have more success displaying entertainment-focused ads on a Friday afternoon, and job adverts on a Monday morning.  

If you’re an organized person, then you could even schedule ads to go live months in advance, for example creating a campaign that’ll kick in at midnight on Black Friday.

To control the date and time when an advert is visible on your website, you’ll need to edit the campaign associated with that ad:

  • Select ADning > Campaigns from WordPress’ left-hand menu.
  • Find the campaign that you want to edit, and then click its accompanying Edit button.
  • Click to expand the Advanced date options.

In this expanded panel, you’ll have access to a range of different date and time settings, including the ability to display this advert on a specific day of the week, during the weekend only, or at a certain time. 

How to Sell Ad Space to Third Parties 

Just because you don’t have anything to advertise, doesn’t mean you can’t generate money from advertisements! Once you’ve created some advertising space on your website, you can use ADning to sell this space to third parties, who will then run their ads on your website. 

If you’ve already setup the popular WooCommerce eCommerce plugin, then you can sell this space and receive payments via your existing WooCommerce checkout. 

To take advantage of ADning’s WooCommerce integration, you’ll need to setup the ADning WooCommerce plugin, which is included as part of your ADning license. 

To setup ADning WooCommerce, select ADning from WordPress’ left-hand menu.

Select the Add-ons tab. Adning WooCommerce will be listed under Included Add-Ons. Give this plugin a click, and it should be installed automatically. 

Now select ADning > General Settings from WordPress’ left-hand menu and choose the Sell tab. 

Navigate to ADning General Settings Sell

Click to expand the WooCommerce Settings section. Find the Create Adning Ads WooCommerce Product and give it a click. To start accepting payments via your WooCommerce checkout, select the Activate toggle so that it turns from No to Yes.

Click Save changes.

You should now be able to setup and manage all of your third party ads, via ADning’s Frontend AD Manager:

  • Navigate to the Sell screen, if you haven’t already (ADning > General Settings > Sell.)
  • Click to expand the Frontend AD Manager Settings section.

Click the Frontend AD Manager link, and the AD Manager should open in a new tab, ready for you to configure your third party ads.

Conclusion 

In this article, I showed you how to setup and use the popular ADning Advertising plugin. If you’ve been following along, then you’ll have created a selection of ads, and then customized these ads in several different ways, including displaying different ads based on the visitor’s location, and the time of day. Finally, I showed how you to start selling advertising space to third parties, using the ADning WooCommerce plugin and AD Manager. 

You can learn more about creating, displaying and managing WordPress ads, over at the official ADning website, or by taking a look at the plugin’s documentation.


by Jessica Thornsby via Envato Tuts+ Code
Posted by at No comments:
Labels: , , , , , , , , , , ,

Add Engagement With Interactive Media Plugins for WordPress

Visual engagement is an indispensable part of any website. Without it users won't engage with your content. It also means that you are not reaching any audience or grabbing attention, which in turn means you have no conversions and no revenue. 

You need to create visual engagement that leads to satisfying user experiences that in turn create high conversions and high revenue. 

But managing the large amount of images, audio, and videos you need to make your website function effective requires a lot of space and organization. You need plugins to save you time. 

WordPress media is an umbrella term a large number of plugins including media library management plugins to interactive media plugins like audio, video, flipbooks, galleries, maps, countdown clocks, notifications, timelines, popups, and forms. 

In this article I will show you some different types of WordPress media plugins available on CodeCanyon.  

Understanding WordPress Media Plugins

Visuals are the best way to optimize your pages and content. Visual elements are called media. Media includes but is not limited to images, audio, video, animation, and so on. 

Countdown clocks, contact forms, timelines, buttons, maps, notifications, icons, avatars, popups are also all media and are crucial to the success of a website. 

When it comes to understanding WordPress media you have to start from the Media Library where you manage images, audio, video, and documents. The media library allows you to upload and manage media files, add images to posts, and even do quick edits to your images. You can also create galleries and subfolders. 

But Media Library has a limit. If you run a website that requires few images then the built-in WordPress Media Library is enough. However, if you run large websites that require a lot of images, videos, audio, and more then you will need to use a media library management plugin.You will also need to use plugins specific to each different media element, for example gallery plugins for images, audio plugins for audio, video plugins for video and so on. 

Types of WordPress Media Plugins

WordPress media plugins help you create, upload, store, manage, and display different kinds of media. In short, provide tools for managing and displaying your media. 

The list below is not exhaustive but it shows what is included under the umbrella of WordPress media plugins: 

  • media library management plugins: organizing and processing images, video or other media
  • interactive media plugins: for creating interactive experiences on your site
  • image builder plugins: for designing and creating new images using layers and effects
  • map plugins: for creating and displaying maps
  • galleries plugins: for displaying images
  • audio or video plugins: for adding audio or video players to your site
  • iframe plugins: for embedding other content on your site in an iframe
  • social media plugins: for embedding content from social media
  • avatar plugins: for displaying or creating user avatars
  • icons plugins: make it easy to add icons to your site
  • button plugins: for creating eye-catching buttons like CTAs (call to actions) 
  • countdown plugins: for showing a countdown to some important event 

What Do WordPress Media Management Plugins Do?

Different WordPress plugins work differently and what they do varies.  But in general they help you:

  • categorize items according to theme, size, and more
  • add, delete, arrange, and sort items in the media library
  • add titles to media
  • do batch upload and add many images quickly
  • provide external storage for your media
  • manage how users interact with your media for example users can click on images and open them in separate pages. 

Why Should You Use WordPress Media plugins?

  • They extend the functionality of your website back-end so it can handle large volumes of media.
  • They make your website more attractive to bring in users.
  • They allow users to easily navigate images and media on your website.
  • They increase user engagement and as a result conversions and profits. 
  • They improve the SEO ranking of your website on search engines. 

Things to Consider When Choosing a Media Plugin

  • Speed: You want a lightweight plugin that won’t slow down your website.
  • Features: Think about storage, integration with social networks, email marketing platforms, and payment gateways
  • Responsiveness and mobile-friendliness: More than 70% of traffic to websites comes from mobile devices. Does your media plugin work on mobile browsers?
  • Ease of use: You shouldn't require coding knowledge to be able to use Media plugins. They should be easy to use and customize. 
  • Security: Users trust you with their personal and financial data. Choose media plugins that have a great track record when it comes to security. 
  • Regular Updates: Regular updates solve security vulnerabilities. Choose a plugin with a track record of updates and maintenance.   
  • Cost: Compare the prices of other plugins and see what fits your budget. 
  • Ratings and reviews: What other users say is proof of quality of the plugin and the trustworthiness of the developer. 
  • Downloads: The number of downloads is proof of popularity of the plugin among users. It shows they trust the provider. 
  • Support: You may run into some issues. Make sure that the seller offers support. See what other users say about the quality of support from the provider. 

WordPress Media Plugins on CodeCanyon

On CodeCanyon, will find many popular and best-selling WordPress media plugins that will make your website engaging to visitors. To help with your selection, I’ve classified them according to the categories below. 

Media Library Management Plugins

The Media Library is where you can manage your images, audio, videos, and documents all in one place. The default WordPress Media Library is sufficient to manage a limited number of images. But business, magazine, and large blogging websites that regularly upload large numbers of images need plugins for efficient management of media files. 

These top media management plugins will help you manage your media library. 

WordPress Gallery and Slider Plugins

Gallery plugins have been covered extensively in other Envato Tuts+ posts. The articles below will lead you to an overview of gallery plugins available on CodeCanyon. 

Image Builders and Virtual Tour Builders

Image and virtual tour building plugins make it easy to create new visual content for your site by combining other images. 

WordPress Interactive Map Plugins

These plugins will help you add interactive map features to your website so users can learn geography or find directions for locations where they need to be! 

Quiz, Survey, and Poll Plugins for WordPress

Surveys, quizzes, and polls are interactive forms. There are plugins that are specifically built to allow you to create your own engaging surveys, polls, and quizzes—all kinds of content that have been shown to be very popular with website visitors. 

Flipbook and PDF Viewer Plugins

Digital flipbooks look and feel like printed publications. Their pages can be flipped and turned. They’re a perfect way to show reports, presentations, magazines, catalogs, brochures, books, photo essays, and portfolios. They offer a great interactive experience. Try the following plugins and find out for yourself. 

WordPress Video Plugins 

These plugins are essential if you want to add video players to your website.

WordPress Audio Plugins 

Similarly, these plugins are essential if you want to add audio players to your website. 

Social Media Plugins for WordPress

There are many media plugins and each fulfills a specific function like counting likes, creating posters, embedding carousels of content from social media, streaming, and so on. 

Visual Timeline Plugins for WordPress 

These timeline plugins will help connect events together to visually tell a story that is engaging.

Avatar and Icon Plugins 

Avatars are used for user profile images and creating a connection with the audience. Avatar plugins allow users to upload custom avatar images and showcase additional information about content authors. 

Icons are symbols that represent particular information. Icon plugins come with collections of symbols that help you choose the relevant icon for particular information. 

These plugins will help you add avatars and icons to your pages. 

Button Plugins for WordPress

Buttons are the most effective tools to get your users to take action. You can use buttons to redirect users to a desired action like buy now, sign up now, purchase, or to a promotions link. These button plugins will get your users to take action.  

iframe Plugins

These plugins allow you to display content from external sites and sources on your website, so users don't have to leave your site.

Popups and Opt-in Plugins 

How to convert your visitors to subscribers is an ongoing question. Popup opt-ins have the highest conversion rate of all opt-ins. But for popups to be effective they have to well designed and used thoughtfully. These popup and opt-in plugins will help you gain more conversions. 

Hover Effects Plugins 

These plugins allow you to create engaging effects for images on your website. Effects like transitions, transforms, flips, animations and more. 

Weather Plugins

For event planners and venue managers the weather is part of their planning. Bad weather can mean low attendance. These weather plugins help planning. 

Countdown and Timer Plugins

If you have a sale, product launch, or event to sell tickets for, these countdown times plugins will create a sense of urgency for users on your website and increase your conversions. 

Notification Plugins 

Notifications have a greater rate of opt-in than emails. They grab attention by appearing directly on the browser. This results in increased engagement, high rate of return audience, increased conversions and revenues. If you're serious about engaging an audience you already have, these notification plugins will bring users back to your website for more. 

Some Useful Bonus Plugins

Even though they don't fit into any category, these plugins are very useful for your website. 

Conclusion

I hope the WordPress media plugins highlighted in this article will help you in your journey build a dynamic WordPress website for your business. 

If you want to improve your skills building WordPress sites, check out our free WordPress tutorials.

Also the following articles will help you learn more about the WordPress media plugins available on CodeCanyon.



by Lorca Lokassa Sa via Envato Tuts+ Code
Posted by at No comments:
Labels: , , , , , , , , , , ,
Subscribe to: Posts (Atom)