I am showing a demo of PSD to HTML to my client. I want to upload the HTML document with CSS files and images in my server to show the demo to the client.
I am afraid if he will copy the HTML code.
Is there any way to decode / encode the html code so that it will not be understandable to copy?
Even if i prevent Right Click on the page he can use View > Page Source option or can save the webpage and then see the source code.
You cannot protect your JS, CSS or HTML code 100%.
But you could confuse your client by encrypting the code, removing whitespaces, etc. He could copy and paste it but will not be able to edit or extend it that easy.
This tool encrypts HTML to JS:
http://www.iwebtool.com/html_encrypter
CSS compressor (removes whitespaces and new lines):
https://csscompressor.net/
JavaScript compressor (removes whitespaces and new lines): http://javascriptcompressor.com/
As #AMR already mentioned: protect your copyright and setup a contract. My advices above are just in case, if there is no trust in your client!
There is no way of stopping it. You can do what #Mr.Bombastic said but I would just suggest writing a quick nondisclosure form and have the person sign it. You can also just put comments in your page that show its yours. In the end if they steal it and its your code it should be pretty easy to prove even without comments. Civil lawsuits aren't that much.
Related
Just as an experiment - I have taken the page source from a webpage I am viewing and copied it into a file on my desktop. When I try to open this file in my browser, I get a jumbled mess with no formatting.
What could the original page have that my copy does not?
Copying the files from original site through Viewsourcepage, you will not get the CSS and JavaScript files. Usually we call CSS and JavaScript from external source so that is the thing you are facing problem here
My best suggestion is if you want to copy the files from original website use Httracker. Download httrack from the website, Install it and use
Sounds like you're missing the stylesheets as well. Stylesheets include the styling (formatting) for the html.
There are probably CSS and/or JS files that are loaded dynamically from where ever you copied the HTML from. But they are probably relative locations, and you didn't copy those files too.
Static web pages will work when you do this. Their content do not change.
A lot of pages nowadays are dynamic and the source changes based on the client side JS code or values from the backend.
There could also be frameworks and a lot of dependancies for that particular page.
Instead of copy/paste manually, you can try some websitedownloader eg. it's an online one https://websitedownloader.io/
So, I'm trying to make a website, but the problem is I can't find the most effective way to keep the header on every single page. My header is HTML code, and it is the most important source of navigation on the website. The tabs navigate using links to other HTML files (all located locally on my computer) and so every single new page is another separate HTML file. Here are the many different methods I used that all fell short in one way or another:
The most basic way: Copying the header code to EVERY HTML page on the website. I am currently using this method, and it is probably the most ineffective and stupid method ever. The downside (which is pretty obvious) is that not only is it tedious but every time I make a change to the header (like maybe add different menus, add another tab, change the image, etc.) I have to copy the new header code to everything else. That is ridiculous!!
I tried using the w3schools method of implementing a separate HTML file (with only the HTML code) onto the page HTML files. So, I have this 1 HTML file for the header that every page uses so I make a change in that one file and it automatically applies to everything else. However, it didn't let me organize the numerous HTML files effectively because unlike referencing a stylesheet like some file named 'style.css', it doesn't let me put the HTML sheet in a folder that doesn't share the same parent folder as the referencing HTML page files. Hopefully that made sense, but basically, I couldn't get a folder that separated the HTML menu tab files ("pages") and the HTML content files ("posts") without the w3school code failing. Here's the link: https://www.w3schools.com/howto/howto_html_include.asp
I've seen other options on Stackoverflow, like getting around the "can't implement HTML files" by using js files with html code in a document.write(), but this to me is very hard to use because of all my progress so far. Also, I am very uncomfortable with the idea of using document.write because it is probably still very different from a true html file. Seriously, why is there no HTML implementing system that stylesheets and scripts have??? (script src="b.js" script and link rel="stylesheet" href="css/style.css" type="text/css")
Using jQuery. I understand this the least (being an amateur programmer) but I've heard it isn't consistent either. It doesn't seem to work on a local file, and that sounds like a nightmare. Though, if there are good suggestions, having a jquery file tag along seems not the best solution but still a plausible solution.
So, I'm in great trouble. How do other websites do this? Do they use different files??? Do they use PHP files?? Am I going to have to scrap all my hard header HTML work and styling because PHP is another language?? Do I have to use Angular.js??? This is so complicated!
Hopefully, this question made some sense. Please ask if you have questions. Thanks in advance.
UPDATE
After checking numerous other posts on Stackoverflow suggesting PHP, I got my HTML files and then renamed it from "index.html" to "index.php", and holy macro it actually still behaved like an HTML file even if it wasn't!! Now I need to find a way to put:
include("header.php");
into my page PHP files that are actually in HTML code to reference a separate PHP file that has my header. How do I do that? Does it belong in like script tags or something? How do I add PHP code in a PHP file written in HTML code? Thanks for the answers to my previous question, I'm so sorry I should've read the answers on Stackoverflow more thoroughly first.
So I know it's been awhile since I asked the question and probably nobody cares anymore, but I just want to post an update after finding a solution to my question about using php code and how it all works.
First, I learned that in order for this to work, all my files had to be in php format. So I pulled up my folder of my local HTML files and literally just renamed it from something like "index.html" to "index.php". Then, without changing the HTML code, I opened it up in my browser and it was like nothing happened, except it was better! Now it can not only read HTML and style and script codes, but also php codes as well! I added:
<?php
include("header.php");
?>
to the top of my index.php file, for example, and then converted the rest of the files into php format like I did for this. I copied over my header html and css code and saved it in a separate php file in the same folder, and - there was no header. I was confused. What?? Why is it not doing anything? The header.php itself is working, why is the include function not??
Then, I learned that this php include code can't be executed on my local drive, so it doesn't work on my local drive but works when it is public and on a real website hosting service. I then installed XAMPP, which is a commonly used PHP development environment that is an Apache distribution and is totally free. It runs a sort of local hosting service that will support this php code and cause it to execute the way I intended it to. I'm sorry I'm not good at explaining how this works, as I just find it and use it. Anyways, XAMPP did make the php code included above actually do its job and I finally got the header-system I always wanted. Happily ever after, right?
Nope. Now that fundamental stuff is gone, I have to face other problems like formatting (a real pain in the a** considering how I have to find css problems in tons and tons of overlapping code), creating an entire personal search system (having to figure out how to make a php file actually use my brand new MySQL database, which is also run by XAMPP), and lots of other things. But, that sounds like a great adventure that I am willing and definitely eager to go through. Now, finally I am done blabbing for the day...I wonder how many hours of other people's time I just wasted.
Oh yeah..I forgot to mention, happy Fourth of July! (and happy birthday to the beloved Captain America)
Using JavaScript and jQuery is a very easy way to accomplish this. First, just build a sample JavaScript file. Inside, make functions that are run on page load. For example,
function buildPage() {
var html = ' ';
//Build the html through the function
//In the end...
$('html-id').empty().append(html);
}
This way each time the html is built you can just empty(clear whatever is in the id 'html-id') and then add your specific html. For example,
<html>
<head>Put header here!</head>
<body>
<div>Put tabs with onclick events here</div>
<div id="html-id"></div>
</body>
</html>
Each time a different tab is clicked, the buildPage() function should be called in order to build the page accordingly. No multiple html headers needed!
Write something like that
<html>
<head>
<title>First page</title>
</head>
<body>
<?php include ("header.php"); ?>
<!-- rest of your code -->
?php include ("footer.php"); ?>
</body>
</html>
It's recommended to do with that way. Wordpress is working like that too. Include files to main php file.
**Notice all your files have to be .php
Maybe this can help:
Include another HTML file in a HTML file
You can make one header.html and include it in all other html files of your website.
I'm looking to Add social sharing buttons on a static which is having more than 500 Static Pages.
I can add manually but it's very tedious task so looking for an easy way to add.
Is there any Way to get the Permalinks of a Static Site Dynamically I'm thinking to pass it to the Sharing Code so that I can append the URL in the code if there is any way to add a piece of code automatically to all the pages it would be of great help.
Best Regards,
Arpit
You manually have created 500 pages or using php to generate dynamically?
If it is generated dynamically, you can easily add social share plugin to every page.
HTML code for social share by social9.com
https://www.social9.com/get-free-social-share/
...Select "code your own" from the list for HTML Code.
Yes, there is a way.
Use regular expressions in an IDE to find the right places and place the code in the replacing string.
If that's not enough powerful, then write a script, using e.g. Bash in Linux, or Groovy, or I would personally write a simple Java program leveraging the JSoup library.
Lastly, and I would recommend that most, give up maintaining the files manually, and switch to static site generating software, like JBake.
JBake can take your HTML pages and take their content as an input and re-generate the website through templates.
Just a quick question, I have seen some web page if I click view page source, the html code is compressed, if I want my html code to be compressed like that, is there a function doing the compression or I need to use come compress tool to do it before the webpage is loaded on line? Thanks a lot.
I'm not a PHP/*nix guy, but since we have been chatting about it in comments, check these..
For PHP:
http://davidwalsh.name/compress-xhtml-page-output-php-output-buffers
For Apache:
http://perl.apache.org/docs/1.0/guide/modules.html#Apache_GzipChain__compress_HTML__or_anything__in_the_OutputChain
http://betterexplained.com/articles/how-to-optimize-your-site-with-gzip-compression/
Check this discussion as well:
http://forums.macnn.com/79/developer-center/276604/compressing-html-output-with-php/
There are tools available for that purpose, basically these tools remove blank lines from the html code. Search for html optimizer or blank space remover tools on google and you'll find many easily.
If you are using j2ee, there are filter available (as jars), which you can download and edit your web.xml file to use them. They will remove the blank spaces when the page is being displayed.
If for "compressed" you mean without whitespaces, without line breaks, without tabs, etc, yes, there exist tools that could do the job for you, although it would be easy to write a personalized script.
By example, see this script. Here you have the live demo.
I want to know, how to make my html file code to encrypted?
So that if normal user see the code,
then they don't understand the code?
I don't remember how I did it, but I was just reading some of my own code recently and I couldn't even understand it. A normal user would not have a chance. I don't thing encryption was involved however.
You can't. If the user can't see it, the browser wouldn't be able to either!
This is called obfuscation, but it's pointless. People can still view your complete DOM tree in DOM Inspector or Firebug. As this Yahoo blog entry says, "If you don’t want people to see your programs, unplug your server." This applies equally to HTML.
Don't bother. All encryption will do for you is slow down your site. It's not worth 'hiding' it. Any moron can just open up Firebug and see everything without even having to decrypt the source code anyways.
This might be good: http://www.iwebtool.com/html_encrypter
it's free and online makes your code into unicode hope less to copy and edit!
You may try disable the mouse right click.
JS (jQuery):
$(document).bind('contextmenu',function(){return false;});
Again as shown in other posts this is actually meaningless because if someone want to view the source they can just press F12 to open the console and view all the codes.
Also, I don't think a normal user will want to see this kind of things. If they see that, they just think they're pressing the wrong button and close it.
You can use StatiCrypt to encrypt your HTML file using AES-256 encryption. You then get a simple HTML page with a password prompt, see example.
Two cautionary notes from the project's repository:
Disclaimer if you have extra sensitive banking data you should probably use something else!
...
AES-256 is state of the art but brute-force/dictionary attacks would be trivial to do at a really fast pace: use a long, unusual passphrase.
A similar tool is clientside-html-password. There might be others as well, but the bottom line is that you can make an HTML file encrypted.
I've written a tool to encrypt HTML files called PageCrypt. The tool asks for a password at the time of encryption, then spits out an encrypted HTML file. Then, when a user views the encrypted file, they need to input the set password to be able to unscramble and view it.
The tool is hosted here:
https://www.maxlaumeister.com/pagecrypt/
with source code available here:
https://github.com/MaxLaumeister/pagecrypt
Description of the project, from the project page:
PageCrypt - Password Protect HTML
This tool lets you securely password-protect an HTML file. Unlike other password-protection tools, this tool:
Has no server-side components (this tool and its password-protected pages run entirely in javascript).
Uses strong encryption, so the password-protection cannot be bypassed.
All you need to do is choose an HTML file and a password, and your page will be password-protected.
You can try DRM-X 4.0, it supports protect HTML JS CSS and Images. it also supports protect Dynamic Website.
https://www.haihaisoft.com/HTML-Encryption.aspx
https://www.haihaisoft.com/Dynamic-Website-DRM-Protection.aspx