გახსენით Yandex გვერდის კოდი. როგორ შევცვალოთ გვერდის კოდი Google Chrome-ში

თავდაპირველად, ზოგიერთმა შეიძლება იფიქროს, რომ ეს საერთოდ არ არის აუცილებელი ინსტრუმენტი, მაგრამ საიტის მთელი HTML კოდის ნახვა შესანიშნავია კოდში საჭირო ელემენტების მოსაძებნად, ეს შეიძლება იყოს ბმულები, ტეგები, მეტა ტეგები, ატრიბუტები და სხვა ელემენტები. .

ცხელი კლავიშების კომბინაცია +გახსენით საძიებო ფანჯარა, Chrome ბრაუზერში ის გამოჩნდება ზედა მარჯვენა კუთხეში:

სურათი 3. ძიება საიტის კოდით

საძიებო ფორმაში მოთხოვნის შეყვანის შემდეგ, ეკრანი გადავა პირველ ნაპოვნი ელემენტზე, ისრების გამოყენებით შეგიძლიათ გადაიტანოთ მათ შორის და აირჩიოთ თქვენთვის სასურველი:

სურათი 4. ძიება HTML საიტის კოდით

ინსტრუქცია 2: როგორ ნახოთ და დაარედაქტიროთ საიტის HTML და CSS კოდი Google Chrome ბრაუზერში

ახლა ყველაზე მნიშვნელოვანი ნაწილი, რომელშიც გაჩვენებთ, თუ როგორ შეგიძლიათ ბრაუზერში ვებსაიტის HTML და CSS კოდის რედაქტირება. შემდეგ გადაიტანეთ ცვლილებები ბრაუზერში.

ეს სასარგებლო ინსტრუმენტი ყოველთვის ხელმისაწვდომია თქვენს ბრაუზერში; ექსპერიმენტი სხვა ბრძანებებით, რაც გაგიადვილებთ თქვენი საიტის რედაქტირებას.

კარგი დღე, ჩემი ბლოგის ძვირფასო მკითხველებო. ზოგჯერ თქვენ პოულობთ რაიმე ლამაზ ფუნქციას ვებსაიტზე და იწყებთ გაკვირვებას, როგორ მიაღწია შემქმნელმა ასეთ საინტერესო ეფექტს.

გამოდის, რომ პასუხი საკმაოდ მარტივია. და თუ თქვენ გაქვთ გარკვეული უნარები, შეგიძლიათ შეაგროვოთ ბევრი ეს ფუნქცია და შექმნათ თქვენი საკუთარი უნიკალური ვებსაიტი მოკლე დროში.

დღეს ჩვენ ვისაუბრებთ იმაზე, თუ როგორ უნდა გახსნათ გვერდის კოდი, გარკვეული ელემენტი და ვისწავლოთ როგორ გამოიყენოთ ეს უნარი თქვენს სასარგებლოდ.

კოდის საბაზისო ცოდნა

ჩემი საიტი განკუთვნილია დამწყებთათვის და პირველ რიგში მინდა მოკლედ ვისაუბრო საიტებზე და ზოგადად კოდებზე.

სურათის დასახატად, შემდეგ წვრილ ნაწილებად დაჭრა, ჩაწერეთ კოდი ისე, რომ ბრაუზერი ყველა ელემენტს ერთ მთლიანობაში მოათავსებს. ყველაფერი ძალიან რთულად ჩანს? სულაც არა და აზრი არ აქვს ამაზე წუხილს.

ასე იქმნება მაღალი ხარისხის ვებსაიტები. თუ გინდა, ჩაერთე ამ საქმეში და შეისწავლე, თუ არ გინდა, ვერავინ გაიძულებს.

მხოლოდ ერთს ვიტყვი... არაფერია იმაზე სასიამოვნო, ვიდრე იმის დანახვა, თუ როგორ გარდაიქმნება და ცოცხლდება შენ მიერ დაწერილი გაუგებარი სიტყვები: ბმულები მუშაობს, ღილაკები მოძრაობენ, სურათები მოძრაობენ, ტექსტი ცოცავს. ვფიქრობ, ვიცი, რას გრძნობდა ვიქტორ ფრანკენშტეინი.

როდესაც საიდუმლო ენის გაგებას იწყებ და ხედავ, რომ ყველაფერი სინამდვილეში ბევრად უფრო მარტივია, ვიდრე თავიდან ჩანდა, არ შეგიძლია არ გჯეროდეს საკუთარი ძალებისა და ტვინის შესაძლებლობების. ეს ძალიან მაგარია.

როგორ მზადდება ვებსაიტები? იდეალურ შემთხვევაში, პირველ რიგში. ის მხოლოდ სურათს ხატავს. მაგალითად, როგორც ნაჩვენებია ქვემოთ მოცემულ სურათზე. ჯერჯერობით ეს მხოლოდ სურათია, ფოტო. არანაირი ლინკი არ მუშაობს, როცა აწკაპუნებ, არსად არ მიდიხარ, ძებნა არ განხორციელებულა.

ამ ნახატის მიხედვით. შეხედეთ ქვემოთ მოცემულ ეკრანის სურათს. შეიძლება ფიქრობთ, რომ ეს არის სასაცილო და ძალიან რთული სიმბოლოების ნაკრები. სინამდვილეში, ყველაფერი არც ისე რთულია, არსებობს გარკვეული ალგორითმი.

არსებობს მხოლოდ დაახლოებით 150 ტეგი და თითოეული მათგანი პასუხისმგებელია კონკრეტულ მოქმედებაზე: ბმული, დეფისი, თამამი, ფერი, სათაური და ა.შ. მათი გაგება არც ისე რთულია, თუ სურვილი გაქვს და დრო არ გეზარება.

ამ ატრიბუტების ცოდნის წყალობით, თქვენ შეგიძლიათ გადაჭრათ თითქმის ნებისმიერი პრობლემა. მაგრამ თითოეული დეველოპერი პოულობს თავის გზებს მიზნის მისაღწევად.

გამოცდილი შემქმნელები დაუყოვნებლივ ხედავენ, თუ როგორ მიაღწიონ შედეგებს, სხვები კი უნდა იფიქრონ, ეძებონ პასუხი სტატიებში ან კონკურენტების წყაროს კოდში. ისინი უბრალოდ იღებენ საჭირო ნაწილს მესამე მხარის საიტიდან და თავად ასწორებენ მას. ეს მნიშვნელოვნად ამცირებს სამუშაო პროცესს.

ცოტა მოგვიანებით გაჩვენებთ კონკრეტულ მაგალითს.

კოდის ნახვა

ასე რომ, ნება მომეცით ჯერ გაჩვენოთ, თუ როგორ უნდა მოიქცეთ, თუ გჭირდებათ სხვისი html-ის გარკვევა. შემდეგ ყველა სხვა კითხვას უფრო დეტალურად განვიხილავთ.

Საუკეთესო გზა

მეთოდი, რომელსაც თავიდან აღვწერ, დამწყებთათვის ცოტა რთულია, მაგრამ შესავალად წაიკითხეთ. გახსენით გვერდი და დააჭირეთ მაუსის მარჯვენა ღილაკს. აირჩიეთ "შენახვა როგორც..."

შეინახეთ მთელი ვებ გვერდი. როგორც სკრინშოტში ხედავთ, მე უკვე გადმოვწერე ყველაფერი წინასწარ. აქ გვაქვს ორი საქაღალდე.

ყველაფერი რაც თქვენ გჭირდებათ აქ არის. ყოველი ელემენტი. თუ ეს გესმით, შეგიძლიათ სწრაფად მიიღოთ ყველაფერი, რაც გჭირდებათ. მაგრამ ასეთი ამოცანა სულ უფრო შეუძლებელი ხდება. ჩამოტვირთვა არ არის. რა უნდა გააკეთოს, თუ აკრძალულია გვერდის კოპირება?

ეს არის Google Chrome

როგორც უკვე შენიშნეთ, მე ყველაზე ხშირად ვიყენებ Google Chrome-ს და ამ ბრაუზერში სხვისი კოდის სწავლა ისეთივე მარტივია, როგორც მსხლის დაჭედვა. როგორც პრინციპში ნებისმიერ სხვასთან. სქემა არა მხოლოდ მსგავსი, არამედ იდენტური იქნება. გახსენით გვერდი, რომლის კოდიც გვინდა ვიცოდეთ და დააწკაპუნეთ მაუსის მარჯვენა ღილაკით სადმე. ფანჯარაში, რომელიც გამოჩნდება, დააჭირეთ ღილაკს "გვერდის კოდის ნახვა".

ახალ ფანჯარაში გაიხსნება კოდის ფურცელი, რომლის გაგება საკმაოდ რთულია დამწყებთათვის. მაგრამ არ ინერვიულოთ დროზე ადრე.

თუ მხოლოდ ერთი ელემენტის კოდის ცოდნა გჭირდებათ, უბრალოდ გადაიტანეთ მასზე მაუსის საშუალებით და დააწკაპუნეთ მაუსის მარჯვენა ღილაკით. აირჩიეთ Chrome-ის სხვა ფუნქცია: „ელემენტის კოდის ნახვა“.

მაგალითად, შეიძლება დამაინტერესოს როგორ შეიქმნა ლოგო, სურათის ან პროგრამირების ენის გამოყენებით? ყოველივე ამის შემდეგ, თქვენ შეგიძლიათ დახაზოთ კვადრატი CSS-ის გამოყენებით. ბევრი ექსპერტი გვირჩევს რაც შეიძლება მეტი ინფორმაციის კოდში ჩაწერას. როგორ მუშაობენ ისინი პოპულარულ საიტებზე?

ახლა გაჩნდა საჭირო ინფორმაცია. html ზევით, css ქვემოთ. ეს ორი ენაა. პირველი პასუხისმგებელია ტექსტის კომპონენტზე, მეორე კი დიზაინზე. თუ არ იყო CSS, მაშინ თქვენ უნდა მიუთითოთ ფერი და შრიფტის ზომა ყოველ ჯერზე. თითოეული გვერდისთვის ეს ძალიან გრძელია. მაგრამ html რომ არ იყოს, მაშინ ტექსტები არ გვექნებოდა. უხეშად ავხსენი, მაგრამ ზოგადად, ასეა.

სხვათა შორის, თუ გაინტერესებთ როგორ მუშაობს აქ, შეგიძლიათ იხილოთ ქვემოთ მოცემული სურათის ბმული. აი შენი პასუხი.

Mozilla Firefox

თუ მოგწონთ მასტიკაში მუშაობა, მაშინ ყველაფერი ზუსტად იგივე იქნება. გახსენით გვერდი და დააჭირეთ მაუსის მარჯვენა ღილაკს. "გვერდის წყაროს კოდი", თუ გსურთ ნახოთ მთელი კოდი.

ელემენტზე გადასვლისას შეგიძლიათ გახსნათ მისი კოდი.

აქ მონაცემები ნაჩვენებია ეკრანის ბოლოში, მაგრამ სხვაგვარად ყველაფერი ზუსტად იგივეა.

Yandex ბრაუზერი

Yandex ბრაუზერში ყველაფერი ზუსტად იგივეა, რაც წინა ორ ვარიანტში, გახსენით გვერდი, დააწკაპუნეთ მარჯვენა ღილაკით, იხილეთ გვერდის კოდი.

ჩვენ კურსორს ვატარებთ ელემენტზე, თუ გვინდა ზუსტად გავიგოთ მისი კოდი.

აქ ყველაფერი ზუსტად ისეა ნაჩვენები, როგორც Chrome-ში.

ოპერა

და ბოლოს, ოპერა.

სხვათა შორის, შეიძლება შეამჩნიეთ, რომ მაუსის გამოყენება არ გჭირდებათ. კოდის გასახსნელად არის კლავიატურის სწრაფი მალსახმობი და ეს იგივეა ყველა ბრაუზერისთვის: CTRL+U.

ელემენტებისთვის: Ctrl+Shift+C.

ასე გამოიყურება შედეგი.

ეს საინტერესო იქნება დამწყებთათვის

ახლა ნახეთ, როგორ მუშაობს ყველაფერი. თქვენ იპოვით საიტს და ნამდვილად მოგწონთ რაიმე ელემენტი. მაგალითად, ეს. თქვენ უკვე იცით, როგორ გახსნათ ელემენტის კოდი.

ახლა დააკოპირეთ.

მე ვიყენებ , ჩასვით ეს კოდი ახალ html ფაილში, body tag-ში (body ინგლისურად).

ახლა ვნახოთ, როგორ გამოიყურება ეს ყველაფერი ბრაუზერში.

მზადაა. იმისათვის, რომ ტექსტი გასწორდეს კიდეებზე და შეიძინოს მომწვანო ფერი, თქვენ უნდა დააკავშიროთ css ამ დოკუმენტს და დააკოპიროთ სხვა კოდი საიტიდან, საიდანაც ეს დავაკოპირეთ.

ახლა ამას არ გავაკეთებ. ამას მეტი დრო სჭირდება: ჩემიც და შენიც. ვფიქრობ, ყველა დეტალს ჩემს მომავალ პუბლიკაციებში აღვწერ. გამოიწერეთ ბიულეტენი და იყავით პირველი, ვინც გაიგებთ, როდის გამოჩნდება სტატია.

თუ ვერ იტანთ, მაგრამ გსურთ გაიგოთ მეტი html და css-ის შესახებ ახლა, მაშინ მე შემიძლია ტრადიციულად გირჩიოთ უფასო სასწავლო კურსები.

აქ არის 33 გაკვეთილი, რომელიც საშუალებას მოგცემთ დაეუფლონ html - "უფასო კურსი HTML-ზე" .

და აქ არის სრული ინფორმაცია css-ის შესახებ - "უფასო კურსი CSS-ზე (45 ვიდეო გაკვეთილი!)" .

ახლა თქვენ იცით ცოტა მეტი. წარმატებებს გისურვებ მცდელობებში. ისევ გნახავ!

ინტერნეტის თითოეულ მომხმარებელს აქვს თავისი საყვარელი საიტები, რომლებზეც დიდ დროს ატარებს. და მხოლოდ ზარმაცებს არ უფიქრიათ შეხედონ როგორ შეიქმნა და რისგან შედგებოდა. შეუძლებელია ყველა ამ კითხვაზე პასუხის გაცემა, რადგან ვებსაიტის შექმნის მრავალი გზა არსებობს, მაგრამ მისი შემადგენელი ბრძანებების და კოდების დათვალიერება შესაძლებელია და საჯაროდ ხელმისაწვდომია ყველასთვის.

სხვა საკითხია, გაიგებს თუ არა ადამიანი, რომელიც არ არის ჩართული პროგრამირებაში კოდის შემადგენელი სიმბოლოებიდან. მაგრამ ქვემოთ მოყვანილი მაგალითებიდან Google Chrome-ის ნებისმიერ მომხმარებელს შეეძლება საიტების ცალკეული ელემენტების ნახვა.

როგორ ვნახოთ html გვერდის წყაროს კოდი Google ბრაუზერში

იმისათვის, რომ Chrome-ში ნახოთ გვერდის კოდი, თქვენ უნდა შეხვიდეთ თქვენთვის საინტერესო საიტზე და შეასრულოთ შემდეგი ნაბიჯები:

ეს ორი ელემენტი განსხვავდება მათი ფუნქციონალურობითა და მომხმარებლის, პროგრამისტის ან ჰაკერის ინფორმაციის მიხედვით.

რა განსხვავებაა გვერდის კოდსა და მხოლოდ „View Code“ ბრძანებას შორის?

თითოეული ამ ფუნქციის გაანალიზებით, შეგიძლიათ დაწეროთ ცალკე სტატია. პროგრამისტებისთვის ეს განსხვავება მნიშვნელოვანია და მათ ესმით, თუ რა შემთხვევაშია საჭირო Google Chrome ბრაუზერში "View Code" და რომელ "View Page Code" გამოყენება.

მაგრამ საშუალო მომხმარებლისთვის ახსნით, ეს ფუნქციები შეიძლება დაიყოს შემდეგ მიზნებად:

1. „გვერდის კოდის ნახვა“ საჭიროა მხოლოდ გვერდის ძირითადი კომბინაციის სანახავად. ძირითადად, ეს არის საიტის სტრუქტურა (დამატებითი მოდელების გარეშე CSS ფაილების სახით და სხვა დამატებები, რომლებიც რჩება საიტის შემქმნელის საქაღალდეში). ეს სტრუქტურა არ არის შესაფერისი თქვენი საკუთარი გვერდის შესაქმნელად "კოპი-პასტირებით", მაგრამ ის საშუალებას მოგცემთ ნახოთ, რა გააკეთა პროგრამისტმა და რა თანმიმდევრობით უზრუნველყოთ, რომ Google Chrome ბრაუზერში საიტს ჰქონდა ასეთი გარე დიზაინი.
2. "კოდის ნახვა" აჩვენებს დეტალურ სტრუქტურას, ხაზს უსვამს ყველა იმ სფეროს, რომელიც გავლენას ახდენს გვერდზე. თუ გადახვევთ სიის კონკრეტულ კოდს, ის ხაზს უსვამს იმ ელემენტს საიტზე, რომელსაც ის ეკუთვნის.
3. გვერდის კოდის ნახვა იხსნება ცალკე ბრაუზერში მისი რედაქტირების შესაძლებლობის გარეშე. ანუ ის მხოლოდ საიტის კოდის კოპირებისთვის და წასაკითხადაა შესაფერისი. მაგრამ ეს არანაკლებ სასარგებლო ფუნქციაა.
4. „კოდის ნახვა“ ცვალებადია და შეგიძლიათ ნებისმიერი ელემენტის რედაქტირება თქვენთვის მოსახერხებელი გზით. რა თქმა უნდა, ყველა ეს ცვლილება „იცოცხლებს“ გვერდის განახლებამდე, მაგრამ ზოგჯერ სახალისოა ამ პარამეტრების გავლა და უბრალოდ იმის გაგება, თუ რატომ არის საჭირო ესა თუ ის მნიშვნელობა და რა მოხდება, თუ მას შეცვლით. თქვენ არ უნდა იფიქროთ, რომ ასეთი ქმედებებით თქვენ ზიანს აყენებთ საკუთარ თავს ან საიტს - ეს ცვლილებები გავლენას ახდენს მხოლოდ თქვენი Google Chrome-ის კოდზე და არ შედის ინტერნეტში.

ჩვენ განვიხილავთ კითხვას, თუ როგორ უნდა ნახოთ ელემენტის კოდი

თუ ჩვენ გვსურს ვუპასუხოთ ასეთ კითხვას, მაშინ ერთადერთი ვარიანტი, რაც თავისთავად გვთავაზობს, არის მაგალითი. იმის გამო, რომ ერთ სტატიაში ძალიან რთულია გახდე ადამიანი, რომელსაც ესმის ეს თემა (ვებ დეველოპერი), მაგრამ მაგალითით აჩვენო, რომ კითხვა მოგვარდეს, ბევრად უფრო ადვილია.

ელემენტის კოდის ფუნქციონირება ძალიან ფართოა, ამიტომ ჩვენ ვიღებთ ერთ-ერთ სიტყვას Google Chrome ბრაუზერის ვებსაიტზე. გვინდოდა გავითვალისწინოთ რა საკვანძო სიტყვები (კოდში ჩაიწერება როგორც „საკვანძო სიტყვები“) იყო გამოყენებული ჩვენი საიტისთვის. ამისათვის ჩვენ ვასრულებთ შემდეგ ალგორითმს:

ამ ფუნქციის გამოყენების სხვა გზები Google Chrome ბრაუზერში

ზოგადად, აგრძელებთ პასუხის გაცემას კითხვაზე, თუ როგორ უნდა შეხედოთ ელემენტის კოდს და რატომ არის საჭირო, თქვენ უნდა ჩამოთვალოთ მისი ფუნქციები. კერძოდ, Google Chrome ბრაუზერში ნებისმიერი საიტის ელემენტის კოდის ნახვის შესაძლებლობის წყალობით, ჩვენ შეგვიძლია:

• იხილეთ საიტის სტრუქტურა დაწყებული header-დან („საიტის სათაური“) და დამთავრებული ბოლოთი (ნებისმიერი პროგრამის საბოლოო ბრძანება);
• საიტის ყველა ფუნქციის ნახვა, კერძოდ: ბმულები სხვა საიტებზე, დამატებითი მოდულები გარე საიტებიდან და ჩაშენებული მრიცხველების არსებობა სხვადასხვა ინფორმაციის შესაგროვებლად;
• გაარკვიეთ, საიტიდან კოპირება აკრძალულია თუ არა;
• კოდი ჩაიწერს ყველა ბმულს საიტის სხვა გვერდებზე, ასევე მათ დიზაინს და შემდგომ მოქმედებებს მათზე დაწკაპუნების შემდეგ.

ეს სულაც არ არის სასრული სია. მაგრამ უნდა გვახსოვდეს, რომ სპეციალური ცოდნის გარეშე თითქმის შეუძლებელია Google Chrome-ის გვერდის კოდის „წაკითხვა“ და მიღებული მონაცემები პრაქტიკულად არ სჭირდება ჩვეულებრივ მომხმარებელს.

პუნქტი „ელემენტის კოდის ნახვა“ არ მუშაობს

დაუყოვნებლივ უნდა ითქვას, რომ თითოეულ საიტს ექნება ღია წვდომა ელემენტის კოდებზე. ანუ, ყველაზე პოპულარული და ძვირადღირებული საიტებიც კი ღია იქნება მათი კოდის სანახავად. ამიტომ, თუ Google Chrome ბრაუზერში ელემენტი არ არის აქტიური ან წარმოქმნის შეცდომას, მას აქვს შემდეგი შესაძლო მიზეზები:

• მომხმარებლის პროფილი დაზიანებულია;
• მავნე პროგრამის არსებობა კომპიუტერზე;
• დაბლოკვა გარკვეული გაფართოებით შესრულების გაზრდის მიზნით (ეს შეიძლება მოხდეს).

დაზიანებული მომხმარებლის პროფილის შესწორება

ახალი პროფილის შესაქმნელად, თქვენ უნდა წაშალოთ ძველი კომპიუტერიდან. ამისათვის ჩვენ ვაკეთებთ შემდეგს:

1. დახურეთ Google Chrome და გაუშვით ჩაშენებული Windows Explorer ბრაუზერი.
2. შეიყვანეთ შემდეგი ბრძანება მისამართების ზოლში: %LOCALAPPDATA%\Google\Chrome\User Data\.
3. როდესაც დირექტორია იხსნება, მოძებნეთ "ნაგულისხმევი" საქაღალდე და დაამატეთ "Backup" მის სახელს ისე, რომ ასე გამოიყურებოდეს: "Backup Default".
4. ახლა, Chrome ბრაუზერის გადატვირთვის შემდეგ, შეიქმნება ახალი პროფილი.

ჩვენ ვშლით მავნე პროგრამას ან მის ნარჩენებს

თუ ახალი პროფილი არ გვაძლევს წვდომას გვერდის ელემენტის კოდზე და მაინც ვხედავთ შეცდომას, უნდა გავაკეთოთ შემდეგი:

1. გახსენით Windows ბრძანების ხაზი ("Run") და შეიყვანეთ "cmd" ბრძანება იქ.
2. შეიყვანეთ შემდეგი ბრძანება ხაზში: RD /S /Q "%WinDir%\System32\GroupPolicyUsers".
3. მოქმედების დადასტურების შემდეგ შეიყვანეთ ეს: RD /S /Q „%WinDir%\System32\GroupPolicy“.
4. ახლა "gpupdate /force" (ბრჭყალების გარეშე).

თუ ყველაფერი სწორად გაკეთდა, მაშინ კომპიუტერის გადატვირთვის შემდეგ Google Chrome გახსნის ელემენტების კოდს და ბრაუზერი ნორმალურად იმუშავებს.