Useful WordPress Plugins For Writers & Authors

Many people still think that authors need a muse and inspiration. But with modern authors, things are a little different. Now, in addition to inspiration, they also need many tools to create outstanding and competitive articles.

WordPress is one of the most effective and useful platforms for creating various websites. If we talk about writing and blogging, then often such specialists choose this particular functionality. The availability of a variety of plugins allows authors to get all the tools they need in one place to create the best copy for both the audience and search engines. Let’s review the most effective ones.

Top 12 Must Have Plugins for For Writers & Authors

Want to make your writing process simple and efficient? Do it easily with the following best plugins for writers and authors.

1. Just Writing

If jokes about procrastination don’t sound funny to you and that’s your problem, then this plugin can be your lifesaver. It can be very difficult to create quality content when you get distracted every minute. The plugin will make it easier to write text using various functions that may be required while writing. For example, you can instantly check grammar, cut, copy, and so on. The maximum convenience and usefulness of the features will allow you to stop postponing the writing process until later.

2. WP Inject/ImageInject

Writers almost always have to deal with images to support their text with visualisation. Text without images does not engage readers as much as it used to. Authors are aware that it can take a long time to find the appropriate image, download the desired format, save the link, and after adding the image to the site. WP Inject facilitated this task. Also, the plugin will allow you to properly split the text so that your publication and images look harmonious in the final result.

3. Co-Author Plus

Does your site involve collaboration with other authors? Perhaps you have a news resource or platform with user reviews. Anyway, this plugin is the best collaboration tool. It allows you to provide access for publication by another author. In this case, you can select either one author or several (guest mode), and this applies to pages as well. For example, co-authors do not need to have a special profile to make a publication.

4. NextScripts

Writing compelling texts is only half of the job. The second half is to make sure your target audience actually accesses and reads it. This plugin allows you to help your copy get more reach through social media. That is, this tool can automatically duplicate your content on social networks. Therefore, this plugin is a must-have for anyone who wants to get more traffic and readers.

5. Akismet

Receiving a lot of comments and questions is one of the goals most authors pursue when creating their content. And that’s great! But when you have a lot of comments, you also need to manage them properly by filtering and removing spam. This plugin will do all the work you need to do with unwanted comments.

That is, this tool will delete comments that look like spam. After you try this plugin at work, there is no doubt that you will forget about what spam comments are.

6. JetPack

This plugin is a multifunctional tool that is suitable not only for writers but also for everyone who deals with the site and content. The advantage of this tool is that it is a kind of constructor. You can choose only those functions that are right for you. You can set up automatic publication of your texts on different platforms. There are also various functions that will facilitate the process of working on the text.

7. Yoast SEO

Perhaps, this is one of the plugins that can be considered a must-have for all site owners. The authors are certainly no exception. The plugin is available for free with a good arsenal of functions, as well as in the paid version, which has a few more features. It will allow you to improve your text from an SEO point of view so that you can promote your content as effectively as possible.

8. OptInMonster

To win a loyal audience, it is important to constantly convert your prospective leads into loyal readers. The easiest and most effective way to do it is to create lead capture forms. This plugin will just help you create newsletter forms and the best CTA so that your readers stay with you. What’s more, with it you can test several options and find the one that works for your leads best.

9. Nimble Portfolio

Every author should be able to properly demonstrate their work, and this plugin is a real solution for this purpose. Now you can design your services and promote them like top writing websites. The advantage of the plugin is that it allows you to create an excellent portfolio, the quality of which will not change with the desktop or mobile version.

10. Visual Editor Font Size

The desire to enlarge the font during the creation of the text is perhaps a common desire among all writers who work with WP. It’s no secret that the WP offers a default font size, and this is a common problem for many users. This plugin is easy to use, with which you can choose the font size you want without editing the code. That is, the plugin will not affect the actual font size of your site.

11. Copyright Proof

Copyright protection is a hot topic at all times. In the era of digitalisation, every author should think about how to protect their work as well. With this plugin, you can secure your text, and, if necessary, you can prove your copyright. Therefore, if you want your texts not to be duplicated somewhere else by third-party authors, then be sure to download this plugin.

12. WProofreader

Most authors always use additional tools to ensure the quality of their text. With this plugin, you can forget about a lot of third-party tools, as it will instantly fix mistakes as you enter your text. Ready to boost your articles to a professional scale like the top-notch authors featured by the college essay writing service reviews platform create? This WP plugin can help.

If you work with topics that require the use of terminology, then you can customise the dictionary. This plugin can replace such tools as Hemingway Editor or Grammarly. Check out Grammarly Review for more information.

P.S. They are also worth considering solutions in addition to all the plugins we have listed above.

Conclusion

Stop waiting for inspiration, download the plugins you need, and start creating great texts. The effectiveness of these plugins will be your inspiration for creating awesome content again and again.

 

Nathan da Silva - Profile

Posted by: Nathan da Silva

Nathan is the Founder of Silva Web Designs. He is passionate about web development, website design and basically anything digital related. His main expertise is with WordPress, Magento, Shopify as well as many other frameworks. Whether you need responsive design, SEO, speed optimisation or anything else in the world of digital then get in touch. If you would like to work with Nathan, simply drop him an email at [email protected]

It’s good to share

13 Amazing SASS (SCSS) Mixins We Use On Every Website

We absolutely love Sass (SCSS), it’s such a massive time-saver and makes building front-end design such a breeze!

There are many JavaScript tools for working with files and automating other tasks, but Sass’s built-in mixin capabilities allow one to write modular front-end style code. In this article, we have listed thirteen of our favourite Sass mixins for automating the writing of web styles.

The mixins we will be covering in this article are the following:

  • Media Breakpoints
  • Retina Images
  • Clearfix
  • Box Sizing
  • Border Radius
  • Opacity
  • Center Block
  • Text Overflow
  • Font Size
  • Line Height
  • Transitions
  • Calc
  • Converting Tracking to Letter Spacing

If you want to just simply download the Sass Mixin you can click here.

Alternatively, you can copy and paste this below:

Note: If you continue reading, you will find a breakdown of all the mixins, what they do and how to use them


/* Breakpoints
-------------------------*/

@mixin breakpoint($point) {
  @if $point == xl {
    @media (max-width: 75em) { @content; }
  }
  @else if $point == minxl {
    @media (min-width: 75em) { @content; }
  }  
  @else if $point == lg {
    @media (max-width: 62em) { @content; }
  }
  @else if $point == md {
    @media (max-width: 48em)  { @content; }
  }
  @else if $point == sm {
    @media (max-width: 34em)  { @content; }
  }  
  @else if $point == mobile {
    @media (max-width: 25em)  { @content; }
  }  
  @else if $point == mobilexs {
    @media (max-width: 21.875em)  { @content; }
  }      
}

/* Retina Images
-------------------------*/

@mixin image-2x($image, $width, $height) {
  @media (min--moz-device-pixel-ratio: 1.3),
         (-o-min-device-pixel-ratio: 2.6/2),
         (-webkit-min-device-pixel-ratio: 1.3),
         (min-device-pixel-ratio: 1.3),
         (min-resolution: 1.3dppx) {
    /* on retina, use image that's scaled by 2 */
    background-image: url($image);
    background-size: $width $height;
  }
}

/* Clearfix
-------------------------*/

@mixin clearfix() {
    &:before,
    &:after {
        content: "";
        display: table;
    }
    &:after {
        clear: both;
    }
}

/* Box Sizing
-------------------------*/

@mixin box-sizing($box-model) {
  -webkit-box-sizing: $box-model; // Safari <= 5
     -moz-box-sizing: $box-model; // Firefox <= 19
          box-sizing: $box-model;
}

/* Border Radius
-------------------------*/

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
  border-radius: $radius;
  background-clip: padding-box;  /* stops bg color from leaking outside the border: */
}

// Single side border-radius

@mixin border-top-radius($radius) {
  -webkit-border-top-right-radius: $radius;
  border-top-right-radius: $radius;
   -webkit-border-top-left-radius: $radius;
   border-top-left-radius: $radius;
   background-clip: padding-box;
}
@mixin border-right-radius($radius) {
  -webkit-border-bottom-right-radius: $radius;
  border-bottom-right-radius: $radius;
     -webkit-border-top-right-radius: $radius;
     border-top-right-radius: $radius;
     background-clip: padding-box;
}
@mixin border-bottom-radius($radius) {
  -webkit-border-bottom-right-radius: $radius;
  border-bottom-right-radius: $radius;
   -webkit-border-bottom-left-radius: $radius;
   border-bottom-left-radius: $radius;
   background-clip: padding-box;
}
@mixin border-left-radius($radius) {
  -webkit-border-bottom-left-radius: $radius;
  border-bottom-left-radius: $radius;
     -webkit-border-top-left-radius: $radius;
     border-top-left-radius: $radius;
     background-clip: padding-box;
}

/* Opacity
-------------------------*/

@mixin opacity($opacity) {
  opacity: $opacity;
  $opacity-ie: $opacity * 100;
  filter: alpha(opacity=$opacity-ie); //IE8
}

/* Center Block
-------------------------*/

@mixin center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Text overflow
-------------------------*/

@mixin text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Font Size
-------------------------*/

@mixin font-size($size: 12, $base: 16) {
    font-size: $size + px;
    font-size: ($size / $base) * 1rem;
}

/* Line Height
-------------------------*/

@mixin line-height($height: 12, $base: 16){
    line-height: $height + px;
    line-height: ($height / $base) * 1rem;
}

/* Transitions
-------------------------*/

@function prefix($property, $prefixes: (webkit moz o ms)) {
    $vendor-prefixed-properties: transform background-clip background-size;
    $result: ();
    @each $prefix in $prefixes {
       @if index($vendor-prefixed-properties, $property) {
         $property: -#{$prefix}-#{$property}
       }
       $result: append($result, $property);
    }
    @return $result;
}

@function trans-prefix($transition, $prefix: moz) {
    $prefixed: ();
    @each $trans in $transition {
        $prop-name: nth($trans, 1);
        $vendor-prop-name: prefix($prop-name, $prefix);
        $prop-vals: nth($trans, 2);
        $prefixed: append($prefixed, ($vendor-prop-name $prop-vals), comma);
    }
    
    @return $prefixed;
}


@mixin transition($values...) { 
    $transitions: ();
    @each $declaration in $values {
        $prop: nth($declaration, 1);
        $prop-opts: ();
        $length: length($declaration);
        @for $i from 2 through $length {
            $prop-opts: append($prop-opts, nth($declaration, $i));   
        }
        $trans: ($prop, $prop-opts);
        $transitions: append($transitions, $trans, comma);
    }
      
    -webkit-transition: trans-prefix($transitions, webkit);
    -moz-transition: trans-prefix($transitions, moz);
    -o-transition: trans-prefix($transitions, o);
    transition: $values;
}

Media Breakpoints

Media queries allow you us to easily add breakpoints to our stylesheet. With those, we can quickly define custom responsive behaviour for any element within several different breakpoints.

This works perfectly on its own or with popular grid frameworks such as Bootstrap.

The if statement allows us to change any properties of elements based on the size of the screen. This allows you to easily change the behaviour of your CSS attributes for the breakpoints you wish to define.

With the Sass mixins we supplied above, we typically add a new file called responsive.scss and the way we use this is as follows:


@include breakpoint(minxl) { /* Min 1200px */
    /* Add code Here */
}

@include breakpoint(xl) { /* Max 1200px */

}

@include breakpoint(lg) { /* 992px */

}

@include breakpoint(md) { /* 768px */

}

@include breakpoint(sm) { /* 575px */

}

Clearfix

We can apply the clearfix css property easily to any element.

This mixin will definately benefit you whenever you have content floating both to the left and right and want to clear the space below the floated element to insert new content below. We use this as follows:


.element {
    @include clearfix();
}

Box Sizing

box-sizing border-box is a great way to handle the pesky box model issue that comes with setting padding to your layouts. It works from IE8+.

Example usage:


*,
*:after,
*:before {
    @include box-sizing(border-box);
}

Border Radius

Like all other mixins with featured, this is all about saving time. The border-radius CSS property rounds the corners of an element's outer border edge. You can set a single radius to make circular corners, or two radii to make elliptical corners. Like a lot of examples we have showcases, there are ways to add certain CSS properties so they work cross-browser. So to avoid constantly having to write several lines of codes just do make a cross-browser border-radius, we can define this is just one simple line of code as follows:


.element {
    /* For even border-radius */
    @include border-radius(20px);

    /* For different border-radius values */
    @include border-radius(20px, 10px, 5px, 25px);
}

Opacity

The opacity property sets the opacity level for any type of element.

The opacity-level describes the transparency-level, where 1 is not transparent at all, 0.5 which is 50% see-through, and 0 which is completely transparent.

To use this Sass mixin we can use the below code:


.element {
    @include opacity(0.5);
    /* or */
    @include opacity(50%);
}

Both examples above are the same, it's just a matter of preference. The above will both show the .element with 50% transparency. One as an integer from 0 to 1, the other as a percentage from to 100%.

Center Block

If we have an element in which we need to centre without affecting the margin-top and margin-bottom properties we can use our Center Block mixin. This basically centred an element in the middle of its parent container. To use this we can simply use:


.element {
    @include center-block;
}

Text Overflow

The text-overflow CSS property sets how hidden overflow content is signalled to users. It can be clipped, display an ellipsis (' … '), or display a custom string of your choice.

As always, we can avoid writing three lines of code by just writing the following to any element:


.element {
    @include text-truncate;
}

Font Size

With this mixin, we can set a rem font size to all-our elements by just defining the font-size. This is a better way to scale up and down fonts instead of em. Using em will compound based on the other CSS attributes, but rem will only scale up or down based on the size you define in your HTML document. By using this, you will drastically automate your typography coding workflow.

The beauty of this as most of these mixins is that it is cross-browser. This mixin creates a pixel fallback from browsers that don't support rem such as IE8 and below. When the browser doesn't support rem sizing, the mixin will use the pixel equivalent and set the output in both rem and px value for any given element. We use this as follows:


.element {
    @include font-size(16);
}

Line Height

This works in the exact same way as the Font Size mixin describes above. The line-height CSS property sets the height of a line box. It's commonly used to set the distance between lines of text. On block-level elements, it specifies the minimum height of line boxes within the element. On non-replaced inline elements, it specifies the height that is used to calculate line box height.

We use this mixin as follows:


.element {
    @include line-height(24);
}

Transitions

With this, we can easily define animation properties and add them to any element. As of right now, the animation CSS property still needs vendor prefixes, so this will also automatically add that to the CSS in a much quicker way.

This can be time-consuming if you like to use a lot of animation on your website as you have to write a lot of CSS code to make it work cross-browser.

We can use this quite simply with our Sass mixin as follows:


.element {
    @include transition(transform 0.2s ease-in 0.2s, opacity 0.2s ease);
}

Calc

The calc() CSS function lets you perform calculations when specifying CSS property values.

Again, when using calc you have to add several lines of code to make it work cross-browser. Now we can use this as simply as:


.element {
    @include calc( width, '100% - 100px');
}

Converting Tracking to Letter Spacing

If you've used applications such as Photoshop or Illustrator, for example, you will notice that they use 'Tracking' which is essentially the same as letter-spacing. They are calculated differently and so we created a way to make the conversion without having to think about it. If you develop a lot of websites based on PSD's, this will save you quite a bit of time.

We can simply use this as follows:


.element {
    @include tracking(100);
}

This will convert the tracking of the given element to the correct letter-spacing value in pixels. If you want to read more about this you can read an article we wrote specifically on this here: How to calculate CSS letter-spacing vs. “tracking” in typography? Photoshop/Illustrator to CSS

Conclusion

Using Sass mixins like the ones we have outlined above in this article is a great way of making your workflow more efficient and will significantly reduce the amount of time you spend writing CSS code.

The benefits of Sass extend beyond automation and can help to easily create and manage your project stylesheets. Even some of the most basic web projects can have thousands of lines of CSS code. Sass is a great way to break this code up into more manageable bits, each with their own focus.

We hope you enjoyed this article, if you've decided to use this in your project, let us know!

Do you have any other great Sass mixins you use? Let us know in the comments below.

 

Nathan da Silva - Profile

Posted by: Nathan da Silva

Nathan is the Founder of Silva Web Designs. He is passionate about web development, website design and basically anything digital related. His main expertise is with WordPress, Magento, Shopify as well as many other frameworks. Whether you need responsive design, SEO, speed optimisation or anything else in the world of digital then get in touch. If you would like to work with Nathan, simply drop him an email at [email protected]

It’s good to share