Post Anti Copy Paste Script for Median UI Blogger Template

Development UI designer In the world of Blogger, it is growing day by day with a variety of views that are more pleasing to the eye. Lots of talented talents towards User Interface, User Experience…

{getToc} $title={Table of Contents}

Okay, long story short… yesterday I bought a template called Median UI v 1.5, why am I interested in buying it, the answer is really simple:

1. Adaptive Display 🙂 so I’m curious what it’s like, because it’s usually responsive
2. Appearance Mobileit’s interestingHonestly, I’m still having a hard time optimizing mobile, especially when there are rumors that whoever is faster will get a ranking in the SERPs and shift sites that have slower loadings – but to be honest what I’m afraid of is “Mobile First” because if I check Even the appearance of my desktop website is still safe, except for the main page
3. Using Flex CSS also turns out to be, usually it’s just a grid. It is said that Flex is good at adjusting the alignment of each element. Used to position smaller elements or details, so when viewed on a mobile view, it can be 2 columns and small which is really nice and the alignment is pretty neat.
4. There is an AMP version of the Bonus TemplateWell, this is a plus… because I’m still new to AMP… which is a software technology developed by Google. Google AMP is an idealistic project from Google. Its development has the aim of increasing the access speed of a website, specifically in increasing the speed of access via smart phone devices. The food, I was a little worried about “Mobile First” because of this… it looks like it’s true… Even though I actually think it’s more complicated when AMP is on Blogger, I don’t know.. I’m curious about what it’s like..
5. CleanMinimalist and modern impressed

6. I finally bought it “from the developer directly” why? I want Rights from the developer until… especially since I have a fortune, so yeah.. don’t worry.. Buy it..

Will it be installed on RahmanCyber.NET?

I think, haven’t thought about it that way, I want to try it on my website, which is empty of visitors, is it possible to improve?
Position in SERP with a sign can be seen in the existing Query in Google Search Consoleor not really…

Because after I installed it, it’s quite light, friend, and the most important thing for me is Mobile view.

But, it seems a bit heavy, I’ll stick with this on my main website.. because it has a history of its own..:) – I’ll try to optimize it so that it’s lighter at least..

Median UI Template Installation

For the installation, to be honest, I didn’t find it difficult, even without any comments in the edited html code, I quite understand 🙂 but it takes time…wkwkwkwk, with the documentation that is quite complete in my opinion… this is very easy and speed up the work for me .. just copy and paste the style is done.

But right, there are various kinds of template users, maybe for those who are used to tinkering with templates, modifying templates and already sticking with bloggers, the documentation will speed up the work.

But for new blogger friends, that can’t be the case, so with comments on each code element in the html edit, it will provide its own education for new bloggers.. 🙂

I need 1 hour for 1 website 🙂 install this template….

When it was finished, it turned out that I realized… the Anti Copas code that I shared on Tutorial on Installing Anti Copas Script on Blogreally not working..

Hehe, I immediately thought of this.. wow this CSS has an unfamiliar name.. 🙂

So, what steps do I take to solve this?

Anti Copy Paste Script for Median UI Blogger Template

Inspect Element first to find out the location quickly…

Yup! Of course Inspect Element in the browser to be the mainstay 🙂 I inspected the body to find the CSS name for Post, I found it… it’s called postEntry! – here I explain to you how I solved this problem.

Here’s how to install the Anti Copas Script

1. You first open the Post Page (not the main page, but the posting page) in the Browser

2. Then you can right click on the Post Text -> Then select
Inspect Element

3. Then I found out that the class name is like this…

you can see what I circled beside… that’s the key… if you get the key… all we have to do is change the name of the anti-copy paste CSS code section that I made so that it doesn’t work on Pre code, so if you make a tutorial that uses

, then the user will still be able to copy the code.

 

  4. Please Copy the following code which is a modification of the standard Anti Copy Paste CSS Code... 

 
 

   



  
.postEntry {
 user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 -khtml-user-select:none;
 -webkit-user-select:none
}
.postEntry
    precode {
 user-select:text;
 -moz-user-select:text;
 -ms-user-select:text;
 -khtml-user-select:text;
 -webkit-user-select:text
}
 


Please copy..





 
<!--[ Body cegah copas RahmanCyber.Net]--> 
.postEntry {
 user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 -khtml-user-select:none;
 -webkit-user-select:none
}


.postEntry pre code {
 user-select:text;
 -moz-user-select:text;
 -ms-user-select:text;
 -khtml-user-select:text;
 -webkit-user-select:text
}




  I have changed it postEntry yes.. 🙂 , if you want to see the changes, please see blog post anti-copy code However, it needs attention, even if you install this code, you can't guarantee it's safe from copypas.  but at least this is more effective than anti-copas code using javascript, because javascript can be disabled in the browser, right..
 
Oh yes, don't forget to add more protection, so that your posts are not stolen via Feed, How to prevent blog posts from being stolen through feeds with automatic article search software (You've been struggling to create content, haven't you? Remember, making solid articles takes time not to study them, so that delivery becomes easier to understand, and if we look at the prices of professional article creation services according to the niche or even with targeted keywords with research deep is not cheap, imagine 1 article with 1000 words for 100 thousand, then 10 articles have 1 million, 100 articles, already 10 million, 1000 articles 100 million! see how many? 🙂 )
5. After you copy the CSS code above, please search for /b:skinyou first go to Edit Html ( How to Enter the latest Edit HTML )
6. You can put it above the closing bskin code. Why?  to make it easier and less error-prone, can't it be placed elsewhere?  yes, you can also put it above the header code, therapy you need to add 


as long as it's not put in b:if under certain conditions... hehe, for example b:if other than post... 🙂
Of course this doesn't have an effect.. or for example b:if mobile... so the only effect is when the display is mobile.
7. After you finish installing the code... please go ahead SAVE
8. Please see the results, this only applies to Blog Posts Yes, for the title and various texts outside of the blog post, I made it so that it can be copied.

   



  Closing Discussion
That's all for this case, hopefully it's useful, especially for those of you who use templates Median UI Blog version 1.5 this is for your blog.. :), if the previous version is the same if the CSS class name is not changed, but in this case, because I bought it on version 1.5, YES BEGITYU LAH... 🙂