Kuinka luoda palautetta. Web-suunnittelu ja hakukoneoptimointi. PHP palautelomake

Katsotaanpa esimerkkiä helposta ja nopeasta palautelomakkeesta verkkosivustolle, joka on kirjoitettu html- ja php-kielellä.

Miksi lomake on html:ssä ja php:ssä?

CRM-järjestelmille, kuten Wordpress, Joomla ja muille, voit löytää erilaisia laajennuksia palautelomakkeen asentamiseen sivustolle. En kuitenkaan pidä tällaisista liitännäisistä niiden huonosta suorituskyvystä ja hidastaa sivustoa. Koska nämä lisäosat tuottavat edelleen saman html-koodin, suosittelen yksinkertaisen mutta täysin toimivan lomakkeen käyttöä, jota voidaan myös muokata vastaamaan sivustolta tulevaa takaisinsoittoa.

Yhteydenottolomake html-muodossa lisätään yksinkertaisesti Joomlan, OpenCartin hallintapaneeliin, ja jos sivustosi on itse kirjoitettu tai käytät mitä tahansa kehystä, esitetyn koodin käyttäminen ei ole vaikeaa ja mikä tärkeintä, sivusto latautuu nopeasti kuin ennen koodin lisäämistä.

Rakenne, jolla palaute järjestetään sivustolle

Jotta kaikki toimisi, annan sinulle rakenteen, mitä tarvitaan yhteydenotto- tai soittolomakkeen toimimiseen?

Sivulle lisätty HTML-koodi + css-tyylejä.
Php-tiedosto, joka lähettää kirjeen.

Html-koodi sisältää tiedot siitä, mitkä syöttökentät on näytettävä, ja niiden kuvatekstejä. CSS-tyylit vastaavat itse lomakkeen visuaalisesta suunnittelusta ja tietojen näyttämisestä. Kun napsautat lähetyspainiketta, kutsutaan php-tiedosto, joka lähettää kirjeen määritettyyn sähköpostiin. Katsotaanpa lomakkeen lähdekoodia tarkemmin myöhemmin.

HTML-palautelomakkeen koodi

Ensin toimitamme sivuston palautelomakkeen täydellisen koodin HTML-muodossa.

Itse lomake sijaitsee html-tunnisteiden välissä

. Itse lomaketunniste

määritetty css class="form-zvonok", jota käytetään määrittämään lomakkeen näyttö css-tyyleillä.

Lomakkeen attribuutit autocomplete="off" - lomakkeen automaattinen täydennys ei ole käytössä. Form-attribuutti on action="http://site.com/email.php" , se määrittää sen tiedoston osoitteen, jota kutsutaan ja johon lomaketiedot siirretään "lähetä"-painikkeen painamisen jälkeen.

Metodi="post"-attribuutti, tässä tapauksessa tiedot lähetetään piilotettuina eikä niitä näytetä osoitepalkissa, toinen Get-menetelmä lähettää lomaketiedot osoitepalkin kautta. Ottaen huomioon sivuston SEO-optimoinnin tarpeen, sivuston palautelomakkeen tapauksessa on parempi lähettää tiedot Post-menetelmällä, koska Get-menetelmän tapauksessa sivustolla on olennaisesti saatavilla monia samankaltaisia sivuja , jotka eroavat vain muutamista pienistä parametreista.

Tämän div:n sisällä on tunnisteita sisältäviä divejä Ja , ja aivan lopussa - Lähetä-painike, kun napsautat sitä, lomakkeen tiedot lähetetään.

Kirjeen lähettäminen php-skriptillä

Tässä on yksinkertainen kirjoitus kirjeen lähettämiseen

Jos haluat lähettää kirjeen vaadittuun sähköpostiin, vaihda $to-muuttujan arvo [sähköposti suojattu] vaadittuun osoitteeseen. $subject-muuttuja on viestin aihe, jonka sähköpostiohjelmat näyttävät tarkastellessasi kirjainluetteloita. $viesti on kirjeen runko, tämä on itse viesti. $headers - kirjeen otsikko, se ilmoittaa kirjeen tyypin, esim. html, myös kirjeen koodauksen, keneltä kirje on toimitettu ja mihin sähköpostiin vastaus lähetetään.

Takaisinsoittolomakkeen suunnittelu css-verkkosivustolle

Tässä on CSS-suunnittelukoodi sivuston palautelomakkeeseen.

Obratnuj-zvonok(leveys: 100%; maksimileveys: 350px; ) .form-zvonok(leveys: 100%; näyttö: flex; flex-direction: sarake; täyte: 0 20px; laatikon koko: border-box; ) .form-zvonok div( täyttö: 15px 0; ) .bot-send-mail( box-sizing: border-box; leveys: 100%; ) .form-zvonok label,.form-zvonok input( näyttö: lohko; leveys : 100 %; laatikon koko: border-box; ) .form-zvonok label( margin-ala: 5px; font-weight: bold; ) .form-zvonok input( täyttö: 10px 15px; margin-top: 10px; ) .form-zvonok label span(väri: punainen; ) .form-zvonok .bot-send-mail( täyttö: 15px; margin-top: 10px; tausta: ei mitään; reunus: ei mitään; tekstin muunnos: isot kirjaimet; väri: # fff; fontin paino: lihavoitu; taustaväri: #009b97; kohdistin: osoitin; reunus: 3px #009b97 kiinteä; reunan säde: 5px; ) .form-zvonok .bot-send-mail:hover( väri: #009b97 ; taustaväri: #ffff; )

Tee div:n leveydestä yhtä suuri kuin päälohkon leveys ja rajaa enimmäisleveys 350 pikseliin; jos leveys on leveä, html-lomake näyttää venyneeltä:

Obratnuj-zvonok(leveys: 100%; suurin leveys: 350px; )

Järjestäksesi kentät ja lähetä-painikkeen käärimme ne div-kirjaimeen, asetamme näytön taipumaan ja asetamme näytön suunnaksi sarakkeen. Lisää kauneuden vuoksi 20 kuvapisteen pehmuste ylä- ja alaosaan:

Form-zvonok(leveys: 100%; näyttö: taipuisa; taipuisa suunta: sarake; täyttö: 0 20 kuvapistettä; laatikon koko: border-box; )

Kuvateksti ja syöttökenttä on kääritty div:iin:

nimi *

Tälle divlle määritämme täytteet:

Form-zvonok div( täyttö: 15px 0; )

Aseta lähetyspainikkeen leveys yhtä suureksi kuin ylätason lohkon leveys ja määritä laatikon koko reunukselle niin, että se ei ulotu ylälohkon ulkopuolelle:

Bot-send-mail (laatikon koko: border-box; leveys: 100%; )

Samoin tarroille ja syöttökentille:

Form-zvonok label,.form-zvonok input( näyttö: lohko; leveys: 100%; laatikon koko: border-box; )

Räätälöimme allekirjoitusten ja syöttökenttien kauniin ulkonäön:

Form-zvonok label( margin-ala: 5px; font-weight: bold; ) .form-zvonok input( täyttö: 10px 15px; margin-top: 10px; )

Tee tähti punaiseksi:

Form-zvonok etikettiväli (väri: punainen; )

Luomme lähetyspainikkeen:

Form-zvonok .bot-send-mail( täyte: 15px; margin-top: 10px; tausta: ei mitään; reunus: ei mitään; tekstin muunnos: isot kirjaimet; väri: #fff; fontin paino: lihavoitu; taustaväri: # 009b97; kohdistin: osoitin; reunus: 3px #009b97 kiinteä; reunan säde: 5px; )

Kun viet hiiren painikkeen päälle, aseta värinmuutos:

Form-zvonok .bot-send-mail:hover( väri: #009b97; taustaväri: #fff; )

Luo palautelomake

Palautelomakkeen luominen verkkosivulle

Verkkosivuston promootioprosessissa kävijätilastojen tutkimisen ohella vierailijoilta itseltään verkkosivustoa koskevat tiedot ovat erityisen tärkeitä. Yksi helpoimmista tavoista saada tällaisia tietoja on sijoittaa verkkosivustolle sivu, jolla on palautelomake. Vierailija jättää viestin, joka lähetetään sähköpostiosoitteeseesi tai johonkin muuhun valitsemaasi sähköpostiosoitteeseen. Tässä tapauksessa vierailijan ei tarvitse käyttää omaa sähköpostiohjelmaa, hänellä ei tarvitse olla edes omaa sähköpostia.

Yksinkertaisin esimerkki tästä lomakkeesta on esitetty kuvassa 1. (Tämä on täysin toimiva näyte, ja voit käyttää sitä lähettääksesi minulle kiitoskirjeen.)

Kuva 1. Yksinkertainen palautelomake

Tällaisen palautelomakkeen sijoittamiseksi verkkosivustolle tarvitset vain perustiedot HTML:stä ja kyvyn käyttää kahta komentoa - Kopio Ja Lisää. Tarkastellaan toimintosarjaa palautelomakkeen luomiseksi (kuva 1) sivuston HTML-sivulle.

1. Tarkista, että isännöintisuunnitelmasi (toimisto, jossa sivustoasi isännöidään) tukee PHP:tä. Jos ei, joudut todennäköisesti maksamaan ylimääräistä vaihtaaksesi toiseen tariffiin, joka tukee samaa PHP:tä. Sinun ei tarvitse etsiä tämän lyhenteen merkitystä, koska sinun ei tarvitse tuntea PHP:tä.

2. Valitaan sivu, jolle palautelomake halutaan sijoittaa ja liitetään seuraava koodi oikeaan paikkaan:
Sinun nimesi:

Sähköpostiosoitteesi (vastausta varten):

Viestisi:

Kuten näet, koko lomake luodaan tagilla

attribuuttien kanssa action=mail.php(osoitus sivuston sivulle, jossa syötettyjen tietojen käsittelyyn tarkoitettu komentosarja sijaitsee) ja method=post(tapa lähettää tietoja palvelimelle). Yksittäiset rivit luotu tunnisteella täysin ymmärrettävillä ominaisuuksilla. Yksittäisten lomakeelementtien, tekstin, fonttien jne. sijainti. voit muuttaa sitä sivustosi suunnittelun mukaan. Tagissa </b> viestin tekstin syöttöalueen mitat asetetaan: rivien ja sarakkeiden määrä (rows="3" cols="25").</p> <p><b>3. </b> Luodaan uusi sivu <b>mail.php</b>, samanlainen kuin tavallinen HTML, mutta .php-tunniste. Koko sivun koodi näkyy kuvassa 2:</p> <p><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br> <html xmlns="http://www.w3.org/1999/xhtml"><br> <head><br> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><br> <title>Palaute</title><br> </head><br> <body><br><?php <br>if (isset($_POST["nimi"])) ($nimi = $_POST["nimi"];) <br>if (isset($_POST["sähköposti"])) ($sähköposti = $_POST["sähköposti"];) <br>if (isset($_POST["sotku"])) ($sotku = $_POST["sotku"];)</p><p>$to = "pupkin@rambler.ru"; /*Syötä sähköpostiosoitteesi*/ <br>$headers = "Sisältötyyppi: teksti/plain; charset=utf-8"; <br>$subject = "Viesti sivustoltasi"; <br>$message = "Lähettäjän nimi: $nimi \nSähköpostiosoite: $sähköposti \nViesti: $mess"; <br>$lähetä = posti($vastaanottaja, $aihe, $viesti, $otsikot); <br>jos ($send == "true") <br> {<br>kaiku" <b>Kiitos viestisi lähettämisestä! <p>";<br>kaiku" <a href=index.html>Klikkaus</a> palataksesi pääsivulle"; <br> } <br>muu <br> {<br>kaiku" <p><b>Virhe. Viestiä ei lähetetty!"; <br> } <br>?> <br> </body><br> </html></p> <h5><i>Kuva 2.</i> Palautelomakkeen käsittelysivun koodi</h5> <p>Linkkien osoitteet, joihin sinun on kiinnitettävä huomiota, on korostettu punaisella:</p> <ul><li>pupkin@rambler.ru - korvaa Pupkinin osoite sähköpostiosoitteellasi, johon lähetetään viestejä sivuston vierailijoilta sekä väsymättömiltä roskapostittajilta. Muuten, niiltä suojautumiseksi lomakkeeseen syötetään usein niin kutsuttu captcha. <b>CAPTCHA</b>- Täysin automatisoitu julkinen Turing-testi, joka erottaa tietokoneet ja ihmiset toisistaan - täysin automatisoitu julkinen Turing-testi, joka erottaa tietokoneet ja ihmiset toisistaan). Yleensä nämä ovat erittäin vääristyneitä numeroita ja kirjaimia, jotka sinua pyydetään syöttämään ennen viestin lähettämistä. Puhumme captchasta yhdessä seuraavista artikkeleista. <br>Jos haluat lähettää kirjeitä useisiin osoitteisiin, luettele ne pilkuilla erotettuina.</li> <li>a href=index.html - sivuston pääsivun (kotisivun) osoite.</li> </ul><p>Sivu luotu <b>mail.php</b> tulee sijoittaa samaan sivustohakemistoon (hakemistoon, kansioon), jossa palautelomakkeen sivu sijaitsee.</p> <p>Tarkista palautelomakkeen toimivuus. Jos kaikki on tehty huolellisesti, lomakkeen täyttämisen ja painamisen jälkeen <b>Lähetä viesti</b> Seuraava teksti pitäisi näkyä: " <b>Kiitos viestisi lähettämisestä. palataksesi pääsivulle</b>". Tämän jälkeen löydät postilaatikostasi (tai toisesta palautelomaketta luotaessa määrittämästäsi) oman viestisi rakkaallesi.</p> <blockquote> <p><b><i>Kommentti:</i> </b> joillain isännöintisivustoilla uusi (sivustolle juuri asennettu) palautelomake ei ala toimimaan heti, eivätkä ensimmäiset kirjeet tule perille tai saapuvat 1-2 päivän viiveellä. Todennäköisesti siellä on "vaihteiden hionta" ja sitten kaikki toimii hyvin. Lisäksi joidenkin isännöintisivustojen kirjeet eivät saavuta tiettyjä osoitteita, esimerkiksi minulla oli ongelmia postilaatikkoni kanssa Ramblerissa ja Mail.ru:ssa. Ratkaise nämä ongelmat ottamalla yhteyttä isännöitsijään - he yleensä auttavat.</p> </blockquote> <p>Joskus kuvattua palautelomaketta käytettäessä koodauksessa ilmenee ongelmia. Jos saapuvassa kirjeessä teksti koostuu alkuperäisten kyrillisten aakkosten sijaan "hulluista koodeista" tai tyhjistä ruuduista, sinun on valittava koodaus manuaalisesti, mikä on tietysti hankalaa. Jotta näin ei tapahdu, tarkista, että sivusi, jolla palautelomake on, on koodattu <b>charset=utf-8</b>. Jos käytät ohjelmaa <b>Adobe Dreamweaver</b>, sitten sinun on valittava valikkoosio tehdäksesi tämän <b>Muokkaa - Sivun ominaisuudet - Koodaus</b>.</p> <p>Sivustotiedostojen koodauksen ongelmaa käsitellään tarkemmin artikkelissa Koodauksen ongelmat palautelomakkeessa.</p> <p>Kuvatussa esimerkissä yksinkertaisuuden vuoksi viesti kirjeen lähettämisestä näkyy tyhjällä sivulla. Voit tietysti sijoittaa sen mille tahansa sivustosi sivulle, jotta vierailija voi käyttää navigointia (valikkoa) valitakseen, mitä hän tekee seuraavaksi. Voit tehdä tämän asettamalla PHP-koodin (se, joka sijaitsee osoitteesta<<b>?php</b> ennen <b>?> </b>) haluamaasi kohtaan valikkosivulla ja muuta sen nimeksi mail.php.</p> <p>Itse palautelomakkeen lähettämisen lisäksi on suositeltavaa tarkistaa, että vierailija on täyttänyt sen kentät oikein. Tämä on tehtävä, jotta et saa tyhjiä kirjeitä ja postilaatikkosi ei ole tukkeutunut napin painamista rakastavien pilaajien lähettämästä roskista <b>Lähetä viesti</b>. Menetelmät palautelomakkeen täyttämisen tarkistamiseksi ja roskapostilta suojaamiseksi on kuvattu artikkeleissa "</p> <p><b>Palautelomake sivustolle</b>, jonka näytän, perustuu Ajax-tekniikan käyttöön. Mutta älä huoli, sinun ei tarvitse tietää tätä, kaikki on jo valmiina, sinun tarvitsee vain asentaa tämä lomake ja muokata sitä itse!</p> <p>Kaverit, käsikirjoitus on vanhentunut kauan sitten. Toisille se toimii, toisille ei. Ja olen liian laiska ymmärtämään sitä, saati päivittämään sitä. Testaa siis oman harkintasi mukaan.</p> <h2>PHP palautelomake sähköpostitse</h2> <p>Tämä <i>sivuston palautelomake</i> on itsessään erittäin toimiva, siihen on kytketty useita laajennuksia, jotka luovat houkuttelevan ulkonäön ja tarkistavat syöttämiesi tietojen oikeellisuuden (lue oikeellisuuden). Nämä laajennukset toimivat suurilla ja mahtavilla! Ja niitä kutsutaan näin:</p> <ol><p>1. <i>JQTransform</i>– laajennus, jonka avulla voit tehdä palautelomakkeestamme kauniin!</p> <p>2. <i>formValidator</i>– ja tämä laajennus tarkistaa yhteydenottolomakkeesta syötettyjen tietojen oikeellisuuden ja näyttää työkaluvihjeitä, jos jotain tapahtuu!</p> </ol><p>Tämän lomakkeen täydellistä toimintaa varten käytetään luokkaa PHPMailer. Pidetään yhtenä parhaista!</p> <p>Huomio älykkäille:</p><p>Sivuston palautelomake voidaan tehdä HTML-muodossa! Mutta se alkaa toimia vain PHP:n avulla! Eikä mitään muuta!</p> <p>Tämä on minulle niille, jotka etsivät palautelomaketta vain HTML-kielellä. Teet sen, mutta se ei toimi!</p> <p>Siksi sinun on tuettava PHP:tä, ja tätä yhteydenottolomaketta varten PHP:n on oltava vähintään versio 5. Toivottavasti teen asian selväksi? Lisäksi nyt mikä tahansa normaali hosting tukee näitä ehtoja!</p> <p>Kaivoin tämän palautelomakkeen nettisivuilta www.tutorialzine.com, linkki johtaa suoraan alkuperäiselle sivulle, ts. tämän lomakkeen kirjoittajan verkkosivuilla!</p> <p>Kaikki siellä on englanniksi, joten meidän ja Sashan täytyi vähän puuhata venäläistääksemme tätä yhteydenottolomaketta ja siihen liitettyjä liitännäisiä.</p> <p>Rehellisesti sanottuna puuhastelimme tätä "lomaketta" kaksi päivää, koska erilaisia bugeja alkoi ilmestyä, emmekä halunneet lähettää palautelomaketta, joka ei ollut täysin täytetty, varsinkin niin kaunis! Joten jos olet kaiken itse tekemisen fani ja ajatus pomppii kirkkaimpiin päähän - venäläistääksesi tämän lomakkeen itse, annan sinulle pari vinkkiä, sillä et rajoitu pelkästään lauseiden kääntämiseen:</p> <ol><p>1. Tämä palautelomake on räätälöity porvaristoa varten, ja se on ladattu sieltä, joten se lähettää sinulle krakozyabl tavallisten venäläisten merkkien sijaan. Ymmärrä koodaus. Ja yleensä kaikki "hylkeet" liittyvät tähän!</p> <p>2. Vahvistusskripti ei aluksi ymmärrä kirjaimiamme, joten ne on kirjoitettava sinne!</p> <p>3. Jopa näiden vaiheiden jälkeen, jos määrität kirjeen aiheen venäjäksi, kirje saapuu otsikolla - Ei aihetta (toivottavasti kirjoitin sen oikein), tämä voidaan korjata, jos määrität koodauksen PHPMailer-luokkatiedostossa .</p> <p>4. Alkuperäisessä muodossa syöttökenttien teksti painettiin pohjaan, ei keskelle. Tämä on häiriö JQTransform-laajennuksessa.</p> </ol><p>No, näyttää siltä, että kaikki oli kirjoitettu ja varoitettu. Siirrytään eteenpäin!</p> <p>Tervehdys, rakas lukija, tänään olen valmistellut sinulle herkullisen html-palautelomakkeen, joka toimii lataamatta sivua uudelleen Ajax-tekniikalla + tehokkaalla laukaisimella, joka motivoi vierailijoitasi käyttämään lomaketta. Blogini lukijat keskustelivat erittäin aktiivisesti edellisestä aloitussivun artikkelistani, nyt arvioimme ja tarkastelemme viimeisteltyä uutta lomaketta. Kaikki tarpeellinen <i><span>lähdekoodi ja demo liitteenä artikkelissa</span> </i>, analysoimme myös työn ja yhteyden rakennetta.</p> <p><b>UPD:</b> Korjattu aiherivillä oleva nimikoodausvirhe. Nyt kaikki näkyy oikein. Kiitämme lukijaa (Ekaterina Karacheva)</p> <p>Itse lomakkeen muoto sisältää myös PHP:n käsittelijän tiedoston, lisäksi työhön tarvitset jquery-kirjaston ja skriptejä, mutta ensinnäkin, en lataa sitä liian kauan - siirrytään tarkasteluun ja palautemme analysointia.</p> <h3>HTML palautelomake - työn rakenne</h3> <p>Lomakkeemme näyttää tältä:</p> <p>Mitä järkeä tässä on? Oikealla puolella on tällainen lomake, mutta vasemmalle puolelle tein erityisen lohkon, joka rohkaisee vierailijaasi syöttämään yhteystietonsa välittömästi! Salaisuus on yksinkertainen: Näetkö päivämäärän ja kellonajan vasemmassa lohkossa? Tämän päivän päivämäärä näkyy koko ajan, ajan myötä näiden kahden tunnin vaihteluväli lasketaan nykyisestä tunnista, oletetaan, jos kellosi on nyt 13:14, niin tuntiväli on: 12-14. Katso kuinka se toimii)))</p> <p>Vierailija näkee: vau, tänään on alennus, ja olin juuri ajoissa, siellä on myös alennus! Se on otettava heti! - Tämä on laukaisemme.</p> <p><img src='https://i0.wp.com/vpluce.ru/wp-content/uploads/2015/01/demo.png' height="50" width="136" loading=lazy loading=lazy><img src='https://i2.wp.com/vpluce.ru/wp-content/uploads/2015/01/skachat-ishodniki.png' height="50" width="272" loading=lazy loading=lazy></p> <p>Latasin html-palautelomakkeen lähdekoodin, katsoin demoa - mielestäni olen pelannut tarpeeksi)) Nyt tärkeimmästä, toimintaperiaatteesta:</p> <p><img src='https://i0.wp.com/vpluce.ru/wp-content/uploads/2015/06/shema-rabotu-formu.jpg' align="center" height="600" width="406" loading=lazy loading=lazy></p> <p>Syötelomakkeen kenttien validointi tapahtuu käsittelijätiedostossa <b>contact.php</b> Alla näkyvässä ohjelmakoodiluettelossa itse lomakkeessa näkyy viesti virheistä ja onnistuneesta kirjeen lähettämisestä, tältä se näyttää lähetyksen jälkeen:</p> <p><img src='https://i2.wp.com/vpluce.ru/wp-content/uploads/2015/06/forma-otpravleno1.jpg' align="center" height="218" width="374" loading=lazy loading=lazy></p> <h3>Lomakkeen käsittelijän lähdekoodi</h3> <p>Liitä riviin <b>52 </b> sähköpostiosoitteesi, joten kaikki kirjeet lähetetään määritettyyn sähköpostiosoitteeseen.</p> <table><tr><td class="line_numbers"> 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 </td><td class="code"> <?php $post = (!empty($_POST)) ? true: false; if($post) { $email = trim($_POST["email"]); $name = htmlspecialchars($_POST["name"]); $email = htmlspecialchars($_POST["email"]); $message = htmlspecialchars($_POST["message"]); $tel = htmlspecialchars($_POST["tel"]); $error = ""; if(!$name) { $error .= "Пожалуйста введите ваше имя.<br /><br /><br /> < 1) { $error .= "Введите ваше сообщение.<br /> <".$tel."> <div class="notification_error">".$error."</div>"; } } ?> </td> </tr></table><p><?php $post = (!empty($_POST)) ? true: false; if($post) { $email = trim($_POST["email"]); $name = htmlspecialchars($_POST["name"]); $email = htmlspecialchars($_POST["email"]); $message = htmlspecialchars($_POST["message"]); $tel = htmlspecialchars($_POST["tel"]); $error = ""; if(!$name) { $error .= "Пожалуйста введите ваше имя.<br />"; ) // Puhelimen vahvistustoiminto ValidateTel($valueTel) ( $regexTel = "/^(7,12)$/"; if($valueTel == "") ( return false; ) else ( $string = preg_replace( $regexTel, "", $valueTel); ) return empty($string) ? true: false; ) if(!$tel) ( $error .= "Anna puhelinnumero. <br />"; ) if($tel && !ValidateTel($tel)) ( $error .= "Anna kelvollinen puhelinnumero. <br />"; ) if(!$error) // Tarkista viesti (pituus) if(!$message || strlen($message)< 1) { $error .= "Введите ваше сообщение.<br />";// Tämä rivi asettaa vähimmäisrajoituksen kirjainten kirjoittamiselle. ) if(!?utf-8?b?". base64_encode($name) ."?="; $message ="\n\nNimi: " .$ nimi."\n\nPuhelinnumero: " .$tel."\n\nViesti: ".$viesti."\n\n"; $mail = posti("oma_sähköposti@gmail.com", $aihe, $message , "Lähettäjä: ".$name_tema."<".$tel.">"."Vastaus: ".$email." "." X-Mailer: PHP/" . phpversion()); if($mail) ( echo "OK"; ) ) else ( echo " <div class="notification_error">".$error."</div>"; } } ?></p> <h3>Muodon suorituskyky</h3> <p>Jos haluat vastaanottaa kirjeitä postilaatikkoosi, vaihda yllä mainitsemani rivi. Suosittelen käyttämään gmail.com-postia, lomakkeesta luodun kirjeen vastaanottamisessa ei ole viiveitä tai häiriöitä. Varoitin, koska... Lukijoilla oli monia kysymyksiä (kirjeet eivät saapuneet osoitteeseen mail.ru). Ole varovainen tässä.</p> <p>Täytämme kaikki kentät, huomaa, että puhelinnumero on syötetty kahdeksalla - kirjoitin työkaluvihjeeseen nimenomaan numeron kahdeksalla "89251122333". Kun syötät merkkiä <b>«+» </b> Virheilmoitus tulee näkyviin. Jos joku tarvitsee sitä, se on helppo lisätä käsittelijään <b>«+» </b>.</p> <p><i>Täytetty lomake testitiedoilla</i> </p> <p><img src='https://i1.wp.com/vpluce.ru/wp-content/uploads/2015/06/proverka-formu.jpg' align="center" height="414" width="369" loading=lazy loading=lazy></p> <p><i>Kirje postilaatikossa</i> </p> <p>Kuten näette, saimme kirjeen, jossa oli kaikki kolme täytettyä ja lähetettyä kenttää. Kirjeen "Pyyntö sivustolta" otsikko muuttuu käsittelijässä <b>contact.php</b></p> <p><img src='https://i1.wp.com/vpluce.ru/wp-content/uploads/2015/06/mail2.jpg' align="center" width="100%" loading=lazy loading=lazy></p> <p>Kaikki toimii hyvin, on mukava kuulla palautettasi (rakentavaa kritiikkiä) kommenteissa, jos sinulla on vaikeuksia etkä selviä jostain, kirjoita minulle VK: ssa (löydät sen yhteystiedoista ). Toivon, että pidit tämän palautelomakkeen (palvelujen tilaus, sovellus) ja toimintaan kutsuvan laukaisimen muodostaman symbioosin suunnittelusta ja toimivuudesta. Onnea kaikille työssänne ja positiivista asennetta, hei))</p> <p><b>Valmistettu tuella</b></p> <p>Yksi yleisimmistä käytännön tehtävistä on palautelomakkeen toteuttaminen. Tarkoitatko sen HTML-koodin kirjoittamista, sen suunnittelua CSS:ssä, PHP-skriptin luomista, joka käsittelee käyttäjältä saamansa tiedot ja lähettää sen postitse, JS-skriptin kirjoittamista, joka tarkistaisi lomakkeen syöttämien tietojen riittävyyden, suojaa ideamme roskapostista, jotta postilaatikkomme ei romahtanut bot-hyökkäyksiltä.</p> <p>Kaikkia yllä olevia kohtia käsitellään katsauksessamme ja kommentoimme niitä yksityiskohtaisesti.</p> <p>Joten aloitetaan palautelomakkeen luominen:</p> <h3>HTML</h3> <p>Ensinnäkin kirjoitamme HTML-koodin, joka määrittää kentät, jotka käyttäjä täyttää. Ne virallistetaan tulevaisuudessa. Lomakekoodi näyttää tältä:</p> <p>< form method= "post" action= "mail.php" > < div class = "left" > < label for = "name" >Nimi:</ label> < input maxlength= "30" type= "text" name= "name" /> < label for = "phone" >Puhelin:</ label> < input maxlength= "30" type= "text" name= "phone" /> < label for = "mail" >Sähköposti:</ label> < input maxlength= "30" type= "text" name= "mail" /> </ div> < div class = "right" > < label for = "message" >Viesti:</ label> < textarea rows= "7" cols= "50" name= "message" ></ textarea> < input type= "submit" value= "Lähettää" /> </ div> </ form> </p> <p>Ja visuaalisesti se näyttää nyt tältä:</p> <p><img src='https://i1.wp.com/vaden-pro.ru/sites/default/files/forma-html.png' width="100%" loading=lazy loading=lazy></p> <p>Olen samaa mieltä, toistaiseksi kaikki on rumaa eikä mikään ole selvää, mutta olemme vasta aloittaneet.</p> <p>Katsotaanpa yllä olevaa koodia yksityiskohtaisesti:</p> <ul><li><p>< form method= "post" action= "mail.php" > … </ form> </p><br>Lomakkeen luomiseksi sinun on käytettävä lomaketunnistetta. Hän määrittää kooditulkin lomakkeen alun ja lopun. Sillä, kuten millä tahansa tunnisteella, on koko joukko attribuutteja, mutta lomakkeen toimimiseen tarvitaan vain kaksi, nämä ovat menetelmä (tapa, jolla pyyntö lähetetään palvelimelle, viestiä käytetään vakiona lomakkeissa) ja toiminta ( osoittaa polun lomakkeenkäsittelijätiedostoon, nimittäin kohdassa Tämä tiedosto sisältää PHP-skriptin, joka lähettää sitten käyttäjän syöttämät arvot meille sähköpostitse. Tässä tapauksessa näemme, että tämä tiedosto on nimeltään mail.php ja se sijaitsee samassa sivustohakemistossa kuin tarkastelemamme sivu).</li> <li><p>< input maxlength= "30" type= "text" name= "name" /> </p><br>Seuraavaksi meillä on syötteet. Nämä ovat itse asiassa itse lomakekenttiä, joihin käyttäjät syöttävät tarvitsemamme tiedot (type="text" tarkoittaa, että tämä on tekstiä). Maxlength-attribuutti määrittää, kuinka monta merkkiä käyttäjä voi kirjoittaa tiettyyn lomakekenttään. Tärkein määrite on nimi - se määrittää tietyn kentän nimen. Näillä nimillä PHP-skripti käsittelee myöhemmin siihen syöttämät tiedot. Halutessasi voit myös asettaa paikkamerkkiattribuutin, joka näyttää kentän sisällä tekstiä, joka katoaa, kun kohdistin asetetaan sen sisään. Yksi paikkamerkkien ongelmista on, että jotkin vanhemmat selaimet eivät tue sitä.</li> <li><p>< label for = "name" >Nimi:</ label> </p><br>Käytetään, jos olemme hylänneet paikkamerkit. Tavallinen kentän allekirjoitus, for-attribuutti kertoo mihin kenttään tämä allekirjoitus viittaa. Arvo ilmaisee meitä kiinnostavan kentän nimen.</li> <li><p>< textarea rows= "7" cols= "50" name= "message" ></ textarea> </p><br>Kuten syöttö, se on tarkoitettu käyttäjälle tietojen syöttämiseen, vain tällä kertaa kenttä on räätälöity pitkille viesteille. Rivit määrittää kentän koon riveinä, sarakkeet merkeissä. Yleensä ne määrittävät kenttämme korkeuden ja leveyden.</li> <li><p>< input type= "submit" value= "Lähettää" /> </p><br>Type="submit" kertoo, että tämä on painike lomakkeen lähettämistä varten, ja arvo määrittää tekstin, joka tulee tämän painikkeen sisällä.</li> <li><p>< div class = "right" > </ div> </p><br>käytetään vain lomakkeen visuaaliseen jatkosuunnitteluun.</li> </ul><h3>CSS</h3> <p>Jotta palautelomakkeemme näyttäisi edustavalta, se on muotoiltava. Saadaksesi seuraavan tuloksen:</p> <p><img src='https://i1.wp.com/vaden-pro.ru/sites/default/files/oformlenie-formi.png' width="100%" loading=lazy loading=lazy></p> <p>Käytimme tätä koodia:</p> <p>lomake ( tausta: #f4f5f7; täyte: 20px; ) lomake . vasen, muoto . oikea ( näyttö: inline- block; pystytasaus: ylhäältä; leveys: 458px; ) muoto . oikea ( täyttö- vasen: 20px; ) etiketti ( näyttö: lohko; kirjasinkoko: 18px; tekstin tasaus: keskellä; marginaali: 10px 0px 0px 0px; ) syöttö, tekstialue ( reunus: 1px kiinteä #82858D; täyte: 10px; kirjasinkoko: 16px; leveys: 436px; ) tekstialue (korkeus: 98px; marginaali-ala: 32px; ) input[ type= "submit" ] (leveys: 200px; float: oikea; reunus: ei mitään; tausta: #595B5F; väri: #fff; tekstin muunnos: isot kirjaimet; )</p> <p>En näe järkeä kuvailla CSS:ää yksityiskohtaisesti, vaan kiinnitän huomiosi vain tärkeimpiin kohtiin:</p> <ol><li>Lomakkeen jokaiselle tunnisteelle ei tarvitse kirjoittaa mallia. Yritä rakentaa valitsimet siten, että voit suunnitella kaikki tarvitsemasi elementit muutamalla koodirivillä.</li> <li>Älä käytä tarpeettomia tyyppitunnisteita viivojen katkaisemiseen ja sisennysten luomiseen <span>< br>, < p> </span> jne. CSS näytön kanssa: lohko ja marginaali täyteominaisuuksilla selviää hyvin näistä tehtävistä. Lisää siitä, miksi sinun ei pitäisi käyttää sitä <span>< br> </span> asettelussa yleensä voit lukea artikkelista Tag br, mutta onko se todella välttämätöntä? .</li> <li>Älä käytä lomakkeissa taulukkoasettelua. Tämä on ristiriidassa tämän tunnisteen semantiikan kanssa, ja hakukoneet rakastavat semanttista koodia. Dokumentin visuaalisen rakenteen muodostamiseksi tarvitsemme vain div-tageja ja CSS:ssä määritellyt näyttöominaisuudet: inline-block (järjestää lohkot riviin) ja vertical-align: top (estää niitä leviämästä näytölle) , aseta ne halutulle korkeudelle ja voila, ei mitään ylimääräistä ja kaikki on sijoittuneena haluamallamme tavalla.</li> </ol><p>Niille, jotka haluavat säästää aikaa verkkosivujen suunnittelussa, voin suositella CSS-kehysten käyttöä verkkosivustojen luomisessa, erityisesti itse kirjoitettujen. Valintani tässä suhteessa on Twitter Bootstrap. Voit katsoa oppitunnin lomakkeiden suunnittelusta sen avulla.</p> <h3>PHP</h3> <p>No, on aika saada muoto toimimaan.</p> <p>Menemme sivuston juurihakemistoomme ja luomme sinne mail.php-tiedoston, jolle määritimme aiemmin polun lomaketunnisteen action-attribuutissa.</p> <p>Lopulta hänen koodinsa näyttää tältä:</p> <p><!doctype html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Viestisi on lähetetty onnistuneesti</title> </head> <body> <?php $back = "<p><a href=<span>\" javascript: history.back()\" >Palaa takaisin</a></p>" </span>; if (! tyhjä ($_POST [ "nimi" ] ) ja ! tyhjä ($_POST [ "puhelin" ] ) ja ! tyhjä ($_POST [ "posti" ] ) ja ! tyhjä ($_POST [ "viesti" ] ) ) ( $nimi = trimmi (nauhan_tunnisteet ($_POST [ "nimi" ] ) ) ; $phone = trimmaus ($_POST [ "puhelin" ] ) ) ; $posti = trimma (kaistaleet ($_POST [ "posti" ] )) ) ; $message = trim (kaistaleet ($_POST [ "viesti" ] ) ) ; mail (, , "Kirjoitin sinulle: " . $nimi ." <br />Hänen numeronsa: " . $phone ." <br />Hänen postinsa: " . $mail . <span>"<br />Hänen viestinsä: "</span>. $viesti, ) ; kaiku <span>"Viestisi on lähetetty onnistuneesti! <Br>Saat vastauksen pian <Br>$takaisin"</span>; poistu ; ) else ( kaiku ; poistu ; ) ?></body> </html></p> <p>Voit ohittaa tämän asiakirjan HTML- ja CSS-osien keskustelun. Pohjimmiltaan tämä on tavallinen verkkosivusto, jonka voit suunnitella toiveidesi ja tarpeidesi mukaan. Katsotaanpa sen tärkeintä osaa - PHP-skriptiä lomakkeen käsittelyyn:</p> <p>$takaisin = " <p><a href=<span>\" javascript: history.back()\" >Palaa takaisin</a></p>" </span>; </p> <p>Tällä rivillä luomme linkin palataksemme edelliselle sivulle. Koska emme tiedä etukäteen, miltä sivulta käyttäjä pääsee tälle sivulle, tämä tehdään pienellä JS-toiminnolla. Tulevaisuudessa yksinkertaisesti käytämme tätä muuttujaa näyttääksemme sen tarvitsemissamme paikoissa.</p> <p>if (! tyhjä ($_POST [ "nimi" ] ) ja ! tyhjä ($_POST [ "puhelin" ] ) ja ! tyhjä ($_POST [ "posti" ] ) ja ! tyhjä ($_POST [ "viesti" ] ) ) ( <span>//käsittelijän sisäinen osa</span>) muu (kaiku <span>"Jos haluat lähettää viestin, täytä kaikki kentät! $takaisin "</span>; poistu ; )</p> <p>Lisäämme tähän lomakkeen tarkistuksen varmistaaksemme, että kentät ovat täynnä. Kuten arvasit, $_POST["nimi"]-osaan lainausmerkeissä kirjoitamme syötteidemme name-attribuutin arvon.</p> <p>Jos kaikki kentät on täytetty, skripti alkaa käsitellä tietoja sisäisessä osassaan, mutta jos vähintään yksi kenttä ei ole täytetty, tulee käyttäjän näytölle viesti, jossa häntä pyydetään täyttämään kaikki lomakkeen kentät toistavat "Jos haluat lähettää viestin, täytä kaikki kentät! $takaisin" ja linkki palataksesi edelliselle sivulle, jonka loimme aivan ensimmäisellä rivillä.</p> <p>Seuraavaksi liitämme lomakkeenkäsittelijän sisäosaan:</p> <p>$nimi = trimma(kaistale_tunnisteet($_POST["nimi"])); $puhelin = trimma(nauhat_tunnisteet($_POST["puhelin"])); $posti = trim(nauhat_tunnisteet($_POST["posti"])); $viesti = trim(nauhat_tunnisteet($_POST["viesti"]));</p> <p>Siten poistimme käyttäjän syöttämät tiedot html-tunnisteista ja ylimääräisistä välilyönneistä. Näin voimme suojautua haitallisen koodin vastaanottamiselta meille lähetetyissä viesteissä.</p> <p>Tarkistuksista voidaan tehdä monimutkaisempia, mutta tämä on sinun harkintasi. Olemme jo asentaneet minimaalisen suojauksen palvelinpuolelle. Teemme loput asiakaspuolella JS:n avulla.</p> <p>En suosittele palvelinpuolen lomakesuojauksen kokonaan luopumista JS:n hyväksi, koska vaikka se on erittäin harvinaista, on olemassa ainutlaatuisia, joissa JS on poistettu käytöstä selaimessa.</p> <p>Tunnisteiden puhdistamisen jälkeen lisää viestin lähettäminen:</p> <p>posti ( <span>"mail_to_receive_messages@gmail.com"</span>, <span>"Kirje sivustosi_osoitteesta"</span>, "Kirjoitti sinulle: " . $nimi . " <br />Hänen numeronsa: " . $phone ." <br />Hänen postinsa: " . $mail . <span>"<br />Hänen viestinsä: "</span>. $viesti <span>"Content-type:text/html;charset=windows-1251"</span>) ; </p> <p>Tämä linja on vastuussa viestin luomisesta ja lähettämisestä meille. Se täytetään seuraavasti:</p> <ol><li>"mail_to_receive_messages@gmail.com" – tähän laitat sähköpostisi lainausten väliin</li> <li>"Kirje sivustosi_osoitteesta" on sähköpostiisi lähetettävän viestin aihe. Voit kirjoittaa tänne mitä tahansa.</li> <li>"Kirjoitin sinulle: ".$name." <span>< br /> </span> Hänen numeronsa: ".$phone." <span>< br /> </span> Hänen sähköpostiosoitteensa: ".$mail." <span>< br /> </span> Hänen viestinsä: ".$message – muodostamme itse viestin tekstin. $nimi – lisäämme käyttäjän täyttämät tiedot siirtymällä edellisen vaiheen kenttiin, lainausmerkeissä kuvataan mitä tämä kenttä tarkoittaa, tagilla <span>< br /> </span> Katkaisemme linjan niin, että viesti kokonaisuudessaan on luettavissa.</li> <li>Content-type:text/html;charset=windows-1251 - lopussa on selkeä osoitus viestissä lähetetystä tietotyypistä ja sen koodauksesta.</li> </ol><p><b>TÄRKEÄ!</b></p> <p>Asiakirjan "päässä" määritetty koodaus ( <span>< meta http- equiv= "Content-Type" content= <span>"text/html; charset=windows-1251"</span> /> </span>), koodauksen viestistä Content-type:text/html;charset=windows-1251 ja yleensä PHP-tiedoston koodauksen on vastattava, muuten postitse tulleissa viesteissä näytetään "hulluja sanoja" venäjän tai Englanninkieliset kirjaimet.</p> <p><img src='https://i2.wp.com/vaden-pro.ru/sites/default/files/kodirovka-faila.png' width="100%" loading=lazy loading=lazy></p> <p>Monet eivät ilmoita suoraan lähetettävän viestin koodausta, mutta joissakin sähköpostiohjelmissa tämä voi aiheuttaa ongelmia jatkossa (postiin lähetetään lukukelvottomia sähköposteja), joten suosittelen sen määrittämistä kuitenkin.</p> <h3>Lomakkeesta tarkistetaan syötettyjen tietojen riittävyys</h3> <p>Jotta käyttäjät eivät vahingossa unohda kenttiä ja täyttävät kaiken oikein, on syytä tarkistaa syötetyt tiedot.</p> <p>Tämä voidaan tehdä sekä PHP:ssä palvelinpuolella että JS:ssä asiakaspuolella. Käytän toista vaihtoehtoa, koska näin ihminen voi heti selvittää, mitä on tehnyt väärin, ja korjata virheen ilman ylimääräisiä sivusiirtymiä.</p> <p>Liitämme komentosarjakoodin samaan tiedostoon, jossa meillä on lomakkeen HTML-osa. Meidän tapauksessamme se näyttää tältä:</p> <p>< script>funktio checkForm(form) ( var nimi = muoto. nimi. arvo; var n = nimi. match(/ ^[ A- Za- zA- Jaa- z ] * [ A- Za- zA- Jaa- z ] + $/ ) ; if (! n) ( hälytys( <span>"Syötetty nimi on virheellinen, korjaa virhe"</span>) ; return false ; ) var puhelin = lomake. puhelin. arvo; var p = puhelin. match(/ ^[ 0 - 9 + ] [ 0 - 9 - ] * [ 0 - 9 - ] + $/ ) ; jos (! p) ( hälytys( <span>"Puhelinnumero syötetty väärin"</span>) ; return false ; ) var mail = lomake. postia. arvo; var m = posti. match(/ ^[ A- Za- z0- 9 ] [ A- Za- z0- 9 \. _- ] * [ A- Za- z0- 9 _] *@ ([ A- Za- z0- 9 ] + ([ A- Za- z0- 9 - ] * [ A- Za- z0- 9 ] + ) * \. ) + [ A- Za- z] + $/ ) ; jos (! m) ( hälytys( <span>"Syötetty sähköpostiosoite on virheellinen, korjaa virhe"</span>) ; return false ; ) return true ; )</script> </p> <p>No, nyt tavallinen analyysi:</p> <p>Sen vuoksi, <b>niin, että kun napsautat lomakkeen lähetyspainiketta, tarkistamme sen</b> Liitämme skriptimme käynnistyksen lomaketunnisteeseen:</p> <p>< form method= "post" action= "mail.php" onSubmit= "return checkForm(this)" > </p> <p>Otetaan nyt tarkistuslista kohta kohdalta:</p> <p><img src='https://i1.wp.com/vaden-pro.ru/sites/default/files/proverka-formi.png' width="100%" loading=lazy loading=lazy></p> <br><img src='https://i1.wp.com/vaden-pro.ru/sites/default/files/soobchenie-o-oshibke.png' width="100%" loading=lazy loading=lazy><p>Kuten näet, tällainen minisekki on kirjoitettu jokaiselle kentällemme. Korostin kuvakaappauksessa yhden kentän valinnan punaisella neliöllä, muilla kentillä on samanlainen rakenne, ja jos on tarvetta lisätä kenttä tai poistaa se, voit nyt tehdä sen helposti.</p> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy loading=lazy>");</script> </article> <section class="likes likes-default"> <h2 class="title-section"><span>Piditkö?</span></h2> <p>Napsauta painiketta, jos pidit artikkelista, tämä auttaa meitä kehittämään projektia. Kiitos!</p> <div> <ul class="social-likes"> <li class="vkontakte"></li> <li class="facebook"></li> <li class="odnoklassniki"></li> <li class="twitter"></li> </ul> </div> </section> </main> <aside class="sidebar" role="complementary" data-mh="layout"> <div class="sticky"> <section class="widget popular_posts-2 widget_popular_posts"><h2 class="title-section"><span>Trendit</span></h2><div class="widget-body"> <article class="primary"> <a href="https://rsasite.ru/fi/mobile/pravilnaya-ustanovka-1s-predpriyatie-pravilnaya-ustanovka/"> <div class="thumb"><img width="360" height="240" src="/uploads/e49d0f102a35f6a7887e80ae602cc15f.jpg" class="attachment-thumbnail size-thumbnail wp-post-image" alt="Oikea asennus "1C:Enterprise Install 1C Enterprise 8" sizes="(max-width: 360px) 100vw, 360px" / loading=lazy loading=lazy></div> <h3>Oikea asennus "1C:Enterprise Install 1C Enterprise 8</h3> <div class="summary">Jotta voit asentaa 1C 8.2 -alustan Windows-käyttöjärjestelmää käyttävään tietokoneeseen, sinulla on oltava...</div> </a> </article>  <article class="secondary"> <a href="https://rsasite.ru/fi/mobile/ustanovka-i-nastroika-shablona-na-joomla-3-kak-ustanovit-novyi-shablon-na-joomla/"> <div class="row"> <div class="col col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/c7da5d667771b097d78225ee3e4724f5.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Kuinka asentaa uusi malli Joomlaan" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Kuinka asentaa uusi malli Joomlaan</h5> </div> </div> </a> </article> <article class="secondary"> <a href="https://rsasite.ru/fi/os/zablokirovan-skaip-na-kompyutere-chto-delat-chernyi-spisok-v-skaipe-kak/"> <div class="row"> <div class="col col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/d2094eb96527c7263095df1cb3c01ca5.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Skype on estetty tietokoneessa, mitä minun pitäisi tehdä?" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Skype on estetty tietokoneessa, mitä minun pitäisi tehdä?</h5> </div> </div> </a> </article> <article class="secondary"> <a href="https://rsasite.ru/fi/mobile/programma-dlya-rezervnogo-kopirovaniya-backup-besplatnaya/"> <div class="row"> <div class="col col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/c3cdd53683c7427808d37ff037608f3a.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Ilmainen varmuuskopiointi ja tiedostojen synkronointiohjelma Exiland Backup Free" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Ilmainen varmuuskopiointi ja tiedostojen synkronointiohjelma Exiland Backup Free</h5> </div> </div> </a> </article> <article class="secondary"> <a href="https://rsasite.ru/fi/notebooks/kak-udalit-vse-s-aifona-poshagovaya-instrukciya-opisanie-i-rekomendacii-kak-ochistit-aifon-ot-musor/"> <div class="row"> <div class="col col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/47017668ee60220d406fc9063dcbdee2.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Kuinka puhdistaa iPhone roskista ja tarpeettomista sovelluksista Annan iPhoneni ystävälle kuinka poistaa kaikki" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Kuinka puhdistaa iPhone roskista ja tarpeettomista sovelluksista Annan iPhoneni ystävälle kuinka poistaa kaikki</h5> </div> </div> </a> </article> <article class="secondary"> <a href="https://rsasite.ru/fi/mobile/reshenie-problemy-nerabotayushchego-povorota-ekrana-na-android-planshete/"> <div class="row"> <div class="col col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/82c58b8ed4734e7968c4062dc43441cb.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Mitä tehdä, jos näytön kierto Android-älypuhelimessa ei toimi?" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Mitä tehdä, jos näytön kierto Android-älypuhelimessa ei toimi?</h5> </div> </div> </a> </article> </div></section><section class="widget recent_posts-2 widget_recent_posts"><h2 class="title-section"><span>Nykyinen</span></h2><div class="widget-body"> <article> <a href="https://rsasite.ru/fi/mobile/kak-skachat-s-youtube-lyuboi-rolik-s-pomoshchyu-odnoi-klavishi-osobennosti-plagina-savefrom-net-dlya-yand/"> <div class="row"> <div class="col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/f2aebff3751a9099d8a2a1f9907a0fb9.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Savefrom net -laajennuksen ominaisuudet Yandex-selaimelle, miksi se ei lataa tiedostoja Ohjelmat latausta varten sosiaalisista verkoista" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Savefrom net -laajennuksen ominaisuudet Yandex-selaimelle, miksi se ei lataa tiedostoja Ohjelmat latausta varten sosiaalisista verkoista</h5> </div> </div> </a> </article> <article> <a href="https://rsasite.ru/fi/computer/sverhbystroe-raspoznavanie-rechi-bez-serverov-na-realnom-primere/"> <div class="row"> <div class="col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/b4b6e8f98a0f4caac6a493196ebeae55.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Puheentunnistus työpöydällä" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Puheentunnistus työpöydällä</h5> </div> </div> </a> </article> <article> <a href="https://rsasite.ru/fi/mobile/samsung-galaxy-s3-neo-servisnaya-proshivka-poluchenie-root-samsung-gt-i9301i-galaxy-s-iii-neo/"> <div class="row"> <div class="col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/bfe2cb1de7a1269280590174a0015511.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Getting Root Samsung GT-I9301I Galaxy S III Neo" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Getting Root Samsung GT-I9301I Galaxy S III Neo</h5> </div> </div> </a> </article> <article> <a href="https://rsasite.ru/fi/notebooks/kak-ustanovit-twrp-recovery-raznymi-sposobami-kak-ustanovit-twrp/"> <div class="row"> <div class="col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/3548c4662d59261baaea0d3509aee23a.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Kuinka asentaa TWRP Recovery eri tavoilla TWRP:n käyttäminen: järjestelmän palautustyökalun käynnistäminen" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Kuinka asentaa TWRP Recovery eri tavoilla TWRP:n käyttäminen: järjestelmän palautustyökalun käynnistäminen</h5> </div> </div> </a> </article> <article> <a href="https://rsasite.ru/fi/os/proshivka-ili-pereproshivka-smartfona-highscreen-proshivka-ili-pereproshivka/"> <div class="row"> <div class="col-xs-4"> <div class="thumb"><img width="100" height="75" src="/uploads/30bac9afa696326b9c48819ac463c205.jpg" class="attachment-col-2-crop size-col-2-crop wp-post-image" alt="Highscreen-älypuhelimen laiteohjelmisto tai vilkkuminen Laiteohjelmisto Highscreen Zera F rev" sizes="(max-width: 100px) 100vw, 100px" / loading=lazy loading=lazy></div> </div> <div class="col-xs-8"> <h5>Highscreen-älypuhelimen laiteohjelmisto tai vilkkuminen Laiteohjelmisto Highscreen Zera F rev</h5> </div> </div> </a> </article> </div></section> </div> </aside> </div> </div> <footer role="contentinfo"> <div class="row"> <div class="col col-sm-2"> <h3 class="title-footer">Osat</h3><ul class="list-unstyled"> <li class="menu-den-svadby"><a href="https://rsasite.ru/fi/category/os/">OS</a></li> <li class="menu-den-svadby"><a href="https://rsasite.ru/fi/category/programs/">Ohjelmat</a></li> <li class="menu-den-svadby"><a href="https://rsasite.ru/fi/category/computer/">Tietokone</a></li> <li class="menu-den-svadby"><a href="https://rsasite.ru/fi/category/mobile/">mobiili</a></li> </ul> </div> <div class="col col-sm-2"> </div> <div class="col col-sm-2"> <h3 class="title-footer">Olemme sosiaalisissa verkostoissa</h3> <ul class="list-unstyled"> <li> <a href="https://vk.com/share.php?url=https://rsasite.ru/programs/kak-sozdat-obratnuyu-svyaz-veb-dizain-i-poiskovaya-optimizaciya-forma-obratnoi/">Yhteydessä</a> </li> <li> <a href="https://www.facebook.com/sharer/sharer.php?u=https://rsasite.ru/programs/kak-sozdat-obratnuyu-svyaz-veb-dizain-i-poiskovaya-optimizaciya-forma-obratnoi/">Facebook</a> </li> <li> <a href="https://www.twitter.com/share?url=https%3A%2F%2Frsasite.ru%2Ffi%2Fprograms%2Fkak-sozdat-obratnuyu-svyaz-veb-dizain-i-poiskovaya-optimizaciya-forma-obratnoi%2F">Viserrys</a> </li> </ul> </div> </div> </footer> <noscript></noscript> <script type='text/javascript' src='https://rsasite.ru/wp-content/plugins/wp-postviews/postviews-cache.js?ver=1.68'></script> <script type='text/javascript' src='https://rsasite.ru/wp-content/themes/alpha/dist/js/scripts.min.js?97dcb82ba08eedf6370ca2a8683cd79b'></script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js?ver=4.7.8'></script> <div class="hidden"> </div> </body> </html> <script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>