Skip to content

Twitterin kaltaisen verkkosivuston luominen (5 helppoa vaihetta)

16 de marraskuu de 2021
Group 10

Haluatko luoda sosiaalisen verkostoitumisen verkkosivuston, kuten Twitterin?

Twitterissä on a modernia ja minimalistista muotoilu vankilla ominaisuuksilla – mikä innostaa ihmisiä tekemään jotain sen kaltaista.

Twitterin kaltaisen verkkosivuston tekeminen on kuitenkin haastavaa, varsinkin jos sinulla ei ole kokemusta koodaamisesta.

Jos sinulla ei ole kokemusta koodaamisesta, saatat harkita työn ulkoistamista verkkosivuston kehittäjälle.

Mutta jos sinulla on pulaa pääomasta, se ei tule onnistumaan.

Saatat myös harkita ohjelmoinnin oppimista, mutta se vie sinut kuukausia tai jopa vuosia koodata jotain kuten Twitter.

Joten mikä on paras tapa kiertää se?

Tässä oppaassa opit luomaan Twitterin kaltaisen verkkosivuston 5 helpossa vaiheessa (kirjoittamatta yhtään riviä koodia).

  1. Hanki web-hosting SiteGroundin avulla
  2. Asenna WordPress
  3. Valitse teema
  4. Asenna PeepSo
  5. Määritä teemasi ja PeepSo

1. Hanki web-hosting SiteGroundin avulla

Ensimmäinen askel Twitterin kaltaisen verkkosivuston luomisessa on saada se verkkoon.

Jotta se tapahtuisi, sinun täytyy hanki web hosting hyvämaineisesta hosting-yrityksestä, kuten SiteGround.

Suosittelen itse SiteGroundia seuraavista syistä:

  • Saat chat-tukea alle 3 minuutissa.
  • Nopeat latausajat.
  • Korkea turvallisuus.

Itse asiassa sivustoa, jolla olet juuri nyt, isännöi SiteGround.

Ensinnäkin mene osoitteeseen SiteGround.com ja napsauta ”WordPress Hosting”.

Tarjolla on 3 isännöintisuunnitelmaa, joista voit valita.

Suosittelen ”StartUp”-suunnitelman valitsemista (ellet odota yli 10 000 kävijää kuukaudessa).

Napsauta tätä aloittaaksesi sivustosi SiteGround-isännöinnillä erikoishintaan 6,99 $/kkh.

Kun olet valinnut suunnitelmasi, sinun on tehtävä se valitse verkkotunnuksen nimi verkkosivustollesi.

Millä nimellä haluat kutsua sosiaalista verkostoasi?

Ensinnäkin verkkotunnuksesi tulee olla lyhyt, helposti muistettava ja tuotemerkittävissä.

Sinun on valittava verkkotunnus, jota ei ole rekisteröity.

1637091433 583 Twitterin kaltaisen verkkosivuston luominen 5 helppoa vaihetta

Jos sinulla on ongelmia verkkotunnuksen valinnassa, voit käyttää a yritysnimen generaattori.

Yritä hankkia .com-verkkotunnus muiden laajennusten sijaan, koska se on ylätason verkkotunnus.

Lopuksi sinun on tarkistettava ja täydennettävä tilaus.

1637091434 746 Twitterin kaltaisen verkkosivuston luominen 5 helppoa vaihetta

SiteGround antaa sinulle huomattavan alennuksen, jos valitset 12 kuukauden suunnitelman kuukausittaisen tilauksen sijaan.

Joten jos haluat säästää enemmän rahaa, voit valitse 12 kuukauden suunnitelma.

Jos haluat lisäturvaa, voit lisätä ”SG Site Scanner” -palvelun hintaan 19,80 dollaria vuodessa.

Suosittelen kuitenkin poistamaan sen valinnan, koska se ei ole välttämätöntä.

Onnittelut! Olet tehnyt ensimmäisen vaiheen – hanki verkkoisäntä.

2. Asenna WordPress

Toinen vaihe on WordPressin asentaminen SiteGroundiin.

Tässä oppaassa WordPress on sisällönhallintajärjestelmä (CMS), jota käytät Twitterin kaltaisen verkkosivuston luomiseen.

Se on nopea, joustava, ja täysin muokattavissa tuhansilla teemoilla/laajennuksilla.

Lisäksi sinun ei tarvitse kirjoittaa yhtä koodiriviä käyttämällä sitä.

WordPressin asentaminen SiteGroundiin on erittäin helppoa.

Sinun tarvitsee vain kirjautua sisään tilillesi > verkkosivustot > sivustotyökalut > WordPress > Asenna ja hallitse.

Kuinka asentaa WordPress SiteGroundiin

Voit myös ottaa yhteyttä tukitiimiin, jos et tiedä, miten tämä tehdään.

Ota yhteyttä tukeen napsauttamalla kysymysmerkkikuvake näytön oikeassa kulmassa.

Kun olet asentanut WordPressin, pääset verkkosivustosi hallintapaneeliin siirtymällä kohtaan Verkkosivustot > WordPress Kit > WordPress Admin.

Kuinka siirtyä WordPress-hallintapaneeliin

Kun olet napsauttanut ”WordPress Admin”, pääset hallintapaneeliin, jossa kaikki taika tapahtuu.

Voit määrittää sivustosi asetukset, laajennukset, teemat jne.

Toistaiseksi sinulla on vain teema + laajennus, jolla voit luoda verkkosivuston, kuten Twitterin.

3. Valitse teema

Nyt on aika valita teema verkkosivustollesi.

WordPressissä teemat ovat kokoelma verkkosivustomalleja, joista voit valita muuttaa ulkonäköä sivustostasi.

Valittavana on monia ilmaisia ​​teemoja, mutta on parasta ostaa yksi, jos haluat sen näyttävän ammattimaiselta.

Tässä tapauksessa sinun kannattaa ostaa teema, joka näyttää Twitteriltä.

Teema, jonka haluat saada, on Gecko teema Peepso:

Gecko teema

Napsauta tästä ostaaksesi Gecko-teeman WordPressille.

Siinä on täydellinen asettelu sosiaaliseen verkostoon ja se näyttää hyvin samanlaiselta kuin Twitter.

Teema on täysin muokattavissa – voit lisätä sivustosi logon, sivupalkin widgetejä, alatunnisteen ja paljon muuta.

Voit myös vaihtaa värejä kaikkeen.

Teemalla on myös hämmästyttävä tuki (ilman lisäkustannuksia), joka voi auttaa sinua kaikissa teknisissä ongelmissa.

Käytin tätä teemaa henkilökohtaisesti yhdessä yhteisössäni, ja se on ollut hämmästyttävää.

Kun olet ladannut teeman, sinun on ladattava se sivustollesi.

Siirry WordPress-hallintapaneeliin > Ulkoasu > Teemat > Lataa teema.

Kuinka ladata teema WordPressiin

Valitse sitten lataamasi Gecko-teema ja lataa se.

Kun olet ladannut Gecko-teeman sivustollesi, sinun on aktivoitava se.

Vie hiiri teeman kuvan päälle ja klikkaa ”Aktivoi” aktivoidaksesi teeman.

Olet onnistuneesti asentanut teeman, joka näyttää Twitteriltä!

Parin seuraavan vaiheen aikana opit lisäämään Twitterin sosiaalisen verkostoitumisen ominaisuuksia asentamalla sivustollesi yhden laajennuksen.

4. Asenna PeepSo

Edellisessä vaiheessa olet asentanut teeman, joka integroituu suoraan sosiaalisen verkostoitumisen laajennukseen, Peepso.

Seuraavaksi on aika asentaa todellinen Peepso-laajennus, jossa on Twitterin sosiaalisen verkostoitumisen ominaisuudet.

Suosittelen henkilökohtaisesti Peepsoa seuraavista syistä:

  • Kaunis ja minimalistinen muotoilu.
  • Sosiaaliset profiilit (käyttäjänimi, profiilikuva, bannerikuva ja paljon muuta).
  • Mobiiliresponsiivinen.
  • Lähetä ajatuksesi, kuvat tai videot (samanlainen kuin Twitter).

Aloita siirtymällä kohtaan Peepson nettisivut ja napsauta ”Hae Peepso”.

Valittavanasi on kolme hinnoitteluvaihtoehtoa – Basic, Starter ja Ultimate.

PeepSo hinnoittelu

Napsauta tätä saadaksesi Peepso-laajennuksen WordPressille.

Perusvaihtoehto sisältää ydinominaisuuksia, kuten lähettämisen, ystävät, chatin jne.

Jos haluat lisäominaisuuksia kuten merkit (esim. vahvistettu merkki), käyttäjärajoitukset ja sanasuodattimet, voit ostaa sen sijaan aloitus- tai loppupaketin.

Vaihtoehtoisesti voit ladata ilmainen versio laajennuksen, mutta se sisältää paljon vähemmän ominaisuuksia kuin maksulliset.

Kun olet ladannut Peepson, sinun on ladattava se verkkosivustosi hallintapaneelista/hallintapaneelista.

Siirry sivustosi hallintapaneeliin > laajennukset > lisää uusi > latauslaajennus.

1637091435 380 Twitterin kaltaisen verkkosivuston luominen 5 helppoa vaihetta

Kun olet ladannut Peepso-laajennuksen, aktivoi se napsauttamalla ”Aktivoi”.

Olet onnistuneesti lisännyt Peepso-laajennuksen verkkosivustollesi!

Nyt sinun tarvitsee vain määrittää laajennuksen asetukset ja mukauttaa teemasi.

5. Määritä teemasi ja PeepSo

Viimeinen vaihe on teeman ja PeepSo-laajennuksen määrittäminen.

Tämä vaihe on tärkeä, jos haluat verkkosivustosi näyttävän ja toimivan hyvin.

Siirry ensin verkkosivustollesi ja napsauta ”Muokkaa” yläreunan navigointipalkissa muokataksesi teemaasi.

Kun olet mukautussivulla, näet joukon vaihtoehtoja, jotka muuttavat teeman yleistä ulkoasua.

Gecko-teeman mukauttaja

Sivuston identiteetti -vaihtoehto on paikka, johon voit lisätä sivustosi logon ja otsikon.

Toisaalta ”Värit” -vaihtoehdon avulla voit muuttaa teeman värejä.

On myös monia muita mukautusvaihtoehtoja, joihin voit yrittää puuttua.

Siitä huolimatta tärkein vaihtoehto, jota haluat mukauttaa on ”Widgetit” vaihtoehto.

Siellä voit lisätä sivuwidgetejä (kuten Twitterissä!).

Tässä on vaiheittainen opas widgetien mukauttamiseen:

  1. Napsauta ”Widgetit” -vaihtoehtoa.
  2. Valitse Otsikkowidgetit > Lisää widget.
  3. Vieritä alas ja lisää ”Peepso Userbar”.
  4. Muuta widgetin tyyliksi ”laatikko”.
  5. Palaa takaisin ja valitse ”Sivupalkki vasen”.
  6. Poista kaikki widgetit ”Sivupalkki vasemmalle”.
  7. Valitse ”Lisää widget”.
  8. Vieritä alas ja lisää ”PeepSo-profiili”.
  9. Muuta widgetin tyyliksi ”laatikko”.

Kun olet noudattanut yllä olevia ohjeita, sinun vasen sivupalkki pitäisi näyttää tältä:

1637091436 171 Twitterin kaltaisen verkkosivuston luominen 5 helppoa vaihetta

Olet onnistuneesti mukauttanut teemasi suunnittelua!

Viimeisenä mutta ei vähäisimpänä, sinun on määritettävä PeepSo-laajennus.

Siirry verkkosivustosi hallintapaneeliin > Peepso > Kokoonpano.

Siellä voit muuttaa erilaisia ​​asetuksia, kuten Yleistä, Ulkonäkö ja Viestit.

Alla Yleiset-välilehti, voit näyttää/piilottaa viestit kirjautumattomilta käyttäjiltä.

Voit piilottaa toimintavirran, jos haluat vain näyttää kirjautumisnäytön (kuten Twitterin kotisivun).

PeepSo-kokoonpano

Niitä on tonni muut konfigurointiasetukset jonka voit muuttaa.

Mutta jätän sinun tehtäväsi määrittää se omien tavoitteidesi perusteella.

Suosittelen lämpimästi lukemaan PeepSo-dokumentaatio koska se antaa ohjeet laajennuksen määrittämiseen.

Kaiken lopussa sinulla pitäisi olla verkkosivusto, joka näyttää tältä:

Seurantaketjun yhteisö

Voit jopa ottaa käyttöön mainoksia (Ezoic, Google AdSense, Media.net jne.) tulevaisuudessa sosiaalisen verkostosi kasvaessa.

Tämä on järkyttävän lähellä Twitterin käyttöliittymää, ja tarvitset vain alle päivä tämän luomiseksi.

Lisäksi säästät tuhansien dollarien arvosta kehityskuluja käyttämällä WordPress + PeepSoa.

Parasta on, että voit tehdä kaiken tämän kirjoittamatta yhtään koodiriviä.

Johtopäätös

Tässä artikkelissa opit luomaan Twitterin kaltaisen verkkosivuston viidellä helpolla vaiheella.

Olen käyttänyt PeepSo-laajennusta noin vuoden, eikä minulla ole siitä muuta kuin hyvää sanottavaa.

Se on myös paljon parempi kuin kaikki muut sosiaaliset lisäosat, joita olen koskaan käyttänyt (esim. BuddyPress, bbPress).

Jos pidit tästä artikkelista hyödyllisenä, käytä annettuja linkkejä ostaaksesi luettelossa olevat tuotteet/palvelut (se auttaa maksamaan tämän sivuston kulut!).