Complete Custom Style Editor for Your Website (No CSS or Theme Builders)

Custom style without touching your css code? Yes, you just heard that right. If you are thinking about having a style editor for your WordPress website, you are at the right place!

We know custom style has been a hassle for marketers who focus more on marketing than the backend. But no worries, you have our back.

WordPress’s website already has plenty of features that have made it easy for you to manage your social media marketing through your website. Still, in most cases, you need some editor panel with how you can style your website.

And here is the catch! In this blog, you will get to know how you can do that with our easy guide that will not require you to do any code or use any other theme builder.

Let’s start then;

Custom style on WordPress

Long ago, there was a time when people had to do long lines of code to manage their websites. With the changes in the tech world, those days are gone, and it blessed us with thousands of website solutions.

What is concerning here is that after having all those capabilities on our websites, there’s still a lack of custom style option in our editor panel though having a multi-purpose handling plugin on the dashboard. To custom style, either you have to work on the backend to fix the CSS, or you may need to take help from any page builder.

Even if you take help from those resources, you might get troubles like elementor custom CSS is not working, or overlapping CSS issue on WordPress site, which is frustrating and also unhealthy for your website.

WP Social Ninja, the all-in-one social media plugin, introduced you with customizing social media feeds and social review widgets. But now, with the Custom style editor board, you can edit your styles of each element more precisely and effectively without any external help.

How it works

If you want to get the custom style editors panel of WP Social Ninja, it’s not complicated to find out where and how to start with.

You will find it super easy to handle when you just normally step into the editor’s panel through the WP Social Ninja dashboard. We have an individual style editor for both social feeds and social reviews.

Let’s start with Social feeds;

Social feeds

First, select your social media platform to custom style your social feeds. Give your login credentials, and you are just ready to style the social feed template for your WordPress website.

For instance, if you want to custom style your Instagram feeds, go to the WP Social Ninja dashboard and connect your account with your login credentials.

Click on Add New Template to access the template editor section.

You will get two separate parts to edit your feed template, particularly; General and Style. To style your template, you must first enable your Style option. After enabling the button, you can see the options of the style editor.

Header

The Header is the first option you will get from this editor. This option enables you to style the header part of your template. You can edit the text color of your name from here.

And not only color, you have every accessibility to change the style of your Header. You have Typography option, where you can custom style the name you have on your Header. You can change size, weight, and keep it uppercase or lowercase. Also, you can decorate it exactly like you could do in your custom style CSS.

You can choose your favorite style from the Decoration section with its dropdown options, including Underline, Overline, Line-Through, and more.

Then again, you have User Name and number of posts in your Header part. As you have edited the username style, you can decide the bottom line spacing between the two line of the header.

And now, as you have made a few changes to the styles. According to the style, you may also want to edit your typographies mentioned as a number of posts. Check the Statistical Label.

Under the username, you have the post’s number. Keeping a match with your labels and theme color, you can style the numbers also. You will get options for a custom style that includes text color and typography options.

Lastly, if you want a more customized feed in the header section, you are free to do that. You will get enough custom options for custom syle the Follow button and the header background.

Content

After the Header section, you have the Content part, where your description and hashtags are included in every post.

Let’s see a demo from the Twitter feed;

Statistics

On the page you are putting your Twitter feed, you can choose any part of it to custom style editor. As you’ve edited the header part elements, you have one more part where you can add some modifications.

Your profile has posts, followers, and following numbers. In the Statistics option, you can customize them as well.

Popup Box

With WP Social Ninja, you have Popup Box option to present your Instagram feed nicely. It won’t make people go to another page to see the post in detail.

However, you’ll also get custom style editor options for this function. You can change anything displayed on the popup screen, including the User Name, Post Description, Post Time, and Call to action button.

Here is an example;

Pagination

If you want to display your Instagram posts according to a specific number and want your visitors to click on a button to see all posts, you can do that with the Pagination option.

The style editor panel will allow you to customize this pagination option.

Let’s custom the background color and text color for the Pagination button;

Review Box

This option gives you a variety of features by which you can set the background color for the review box.

It works when you put your cursor on the image posts and see the post details without clicking on it.

Social reviews

Next, you have Social reviews. Now, we will see how the style editor works for social media reviews. Enabling the Style option from the editor panel will give you plenty of custom style editor options that you can customize according to your wish.

Here you go!