Chrome is a well-known web browser in the world of Google. In Chrome, there is Chrome DevTools, which has good support for Coder. But if you don’t know Code, you can still apply some good tricks yourself with Chrome DevTools.
Join the channel Telegram of the AnonyViet 👉 Link 👈 |
Here I will introduce and guide you 3 tips to use Chrome DevTools when you don’t know the code, and of course when you don’t know the code, I can’t guide you to use the tools like a programming coder. website, but I only guide some tips that are not related to code but are very useful for a normal user.
First press F12 or left click select “check” to enable developer tools.
Editing data on the Web to troll friends
I want to remind you that this only changes the data display of the above website your computer not change on all computers accessing the website. Chrome DevTools helps you to edit human Websist content quite simply.
Step 1: I will model with an article of vnexpress.
Then click on the box like the picture I marked number 1, select an image in number 2, left click on number 3 and select “Edit as HTML”
Step 2: Delete the link of that photo, the link with the yellow picture I marked below.
Then insert the link of the other image you want it to appear on the website + Enter done.
Select the “console” tab, at the bottom you enter the line of code document.designMode="on"
. Then go to the website side to edit
These games you can do on facebook to troll your friends. For example, let your friends in the newspaper for example
Note: if you reload the page, everything you edited will disappear. The above text editing method can also edit messages in messenger. So if someone takes a picture of the message, don’t believe it, a lot of scams have happened because of it.
Chrome DevTools supports the screen capture feature on Chrome quite well. There will probably be a time when you need images from a certain website for work or entertainment and you will usually choose third-party software to do it, but from now on after reading this article, take advantage of it. the tool is available on chrome right now.
Step 1: select the ellipsis + Run command.
Step 2: Type “screenshot” in the search box at the top.
It will show four results as shown, you can choose one of four ways to take the most suitable photo
- Capture area screenshot: you can manually select the capture area on Chrome.
- Capture full size screenshot: captures the entire web page and is useful only when it displays text or images, but if the site is a web application it captures only the display.
- Capture node screenshot: capture image by element (code) of Web. Example screenshot showing of the paragraph
<p>abcxyz</p>
- Capture screenshots: just want to take a screenshot of the current display area.
It will then automatically download to your device, so no further action is required.
If you find this method cumbersome, you can use TinyTake to make it easier to take screenshots.
Download music and audio files of the website
Chrome DevTools helps display audio files being downloaded when listening online. You can take advantage of this feature to download music and audio files from other websites.
Step 1: Go to the website you want to download the file, I will make a sample at https://mp3.zing.vn/
- Open Tab Network -> Media + click on listen to music to load the file.
- Then it will show the file name in the name field and the file size in Size.
- Double click on the file name and it will go to the download page.
You can download music from mp3 zing or nhaccuatui or any other online music site. This helps you save a little money instead of buying a VIP acc. This tip is also very useful and greatly complements your foreign language learning because it can download audio files from Google Translate.
In some news websites or nhaccuatui, you can use this method to download videos too. It’s a pity that this way can’t download videos from 2 major MXH today, youtube and facebook. I tried many times but still can’t download. And if you need videos from these 2 social networks, I recommend downloading these 2 browsers to use Cup Cup, Birds (by BKAV)/
So, I have introduced and finished showing you 3 good tips to use Chrome DevTools. The above tips are all my passion after years of using chrome. I find the most useful thing is to download the audio file from Google Translate because it can help many English learners actively.
Collaborators: Truong Thuy Quang Nhat