kontakt@pakiety.pl

Nieprzerwanie od 17 lat zajmujemy się projektowaniem stron www, tworzeniem stron internetowych i sklepów z wykorzystaniem systemów CMS - przeczytaj więcej.

Przedstawiona tu oferta została przygotowana specjalnie z myślą o małych i średnich firmach szukających kompleksowej i taniej obsługi w zakresie przygotowania oraz utrzymania na serwerze strony www.
Proponowane przez nas pakiety są jednymi z najtańszych rozwiązań dostępnych na rynku.

PAKIETY to usługa obejmująca:

  • utworzenie strony www, hosting (utrzymanie na serwerze) oraz zgłoszenie do Google
  • indywidualne podejście do Klienta
  • elegancki wygląd
  • krótki czas realizacji
  • możliwość samodzielnej edycji treści
  • opłaty w wygodnym abonamencie
projektowanie serwisów internetowych tanie / pakiet StartPro więcej podstron, więcej języków
więcej możliwości
StartPro - zarządzasz wszystkim
Wybierz pakiet dla siebie:
Pakiet Start:
tworzenie stron internetowych / pakiet Start
Ceny netto:
opłata aktywacyjna 150 zł
abonament roczny 250 zł
Zapytaj o pakiet Start
Pakiet StartPlus:
tworzenie stron www / pakiet StartPlus
Ceny netto:
opłata aktywacyjna 200 zł
abonament roczny 300zł
Zapytaj o pakiet StartPlus
Pakiet StartPro:
projektowanie serwisów internetowych tanie / pakiet StartPro
Ceny netto:
opłata aktywacyjna 250 zł
abonament roczny 350 zł
Zapytaj o pakiet StartPro
Pakiet StartMax:
projektowanie serwisów www tanio / pakiet StartMax
Ceny netto:
opłata aktywacyjna 300 zł
abonament roczny 400 zł
Zapytaj o pakiet StartMax

 

Wersja demonstracyjna

Aby przećwiczyć działanie systemu należy otworzyć serwis docelowy oraz panel administracyjny systemu WebStudio. Dla ułatwienia działań w obrębie panelu administracyjnego przygotowaliśmy instrukcję obsługi - wszelkie linki zamieściliśmy poniżej:

Serwis docelowy modyfikowany za pomocą poniższego panelu: http://startpro.pakiety.pl Panel administracyjny: http://startpro.pakiety.pl/cms   [ login: test, hasło: test ]

 

Instrukcja obsługi

Instrukcja obsługi systemu samodzielnej administracji treścią WebStudio dostępnego w usłudze Pakiet Start Pro

Wprowadzenie

WebStudio umożliwia samodzielne wprowadzanie, zmienianie i usuwanie podstron, wersji językowych, tekstów, tabel, zdjęć, plików do pobrania, odnośników (linków) względnych (do wybranych miejsc w ramach danej podstrony) i do miejsc poza daną stroną (w ramach serwisu) lub do innych stron i miejsc sieci WWW.

Jest łatwy w użytkowaniu, pozwala na samodzielną pracę osobom, które nie znają lub słabo znają HTML (język w którym pisze się kod stron WWW). Panel edycji zawartości strony WebStudio przypomina typowe edytory tekstowe, takie jak najpopularniejszy MS Word.

Osoby zainteresowane konkretnymi czynnościami mogą, kierując się tytułem sekcji, przejść bezpośrednio do interesującego ich fragmentu.

Zaczynamy pracę z WebStudio

Należy pamiętać !!!

  1. Podczas pracy w panelu administracyjnym należy korzystać z przeglądarki Internet Explorer
  2. Wciśnięcie "enter" powoduje podzielenie tekstu na paragrafy, każdy paragraf oddzielony "enter" można osobno formatować (np. jeśli chcemy przygotowany tekst podzielić w taki sposób by cześć była wyjustowana a cześć wyśrodkowana to odpowiednie fragmenty musimy oddzielić "enter", a następnie tak przygotowanym paragrafom możemy nadać formaty: "justuj" i "wyśrodkuj". Jeśli natomiast chcemy przenieść kursor o jedną linijke w dół bez dzielenia tekstu na paragrafy to musimy posłużyć się kombinacją klawiszy "shift" + "enter".
  3. Istotną sprawą jest wprowadzanie tekstu przeklejanego z innych edytorów lub dokumentów, radzimy by przeklejać tekst jedynie z pliku tekstowego utworzonego w programie "Notatnik", inne edytory np. MS Word dodają fragmenty swoich niewidocznych kodów co utrudnia późniejsze formatowanie, korzystniej stworzony tekst w MS Word przekleić najpierw do wspomnianego "Notatnika" i dopiero stąd przekleić go do pola edycji.
  4. W przypadku dłuższej pracy z WebStudio np. podczas wprowadzania obszernej treści ważne jest częste zapisywanie zmian ponieważ gdy edytujemy jedna podstrone przez dłuższy czas nie przełączając się na inne podstrony połączenie z serwerem może zostać zerwane a wprowadzone zmiany bezpowrotnie utracone.
  5. Podczas zapisywania zmian należy zawsze poczekać aż strona WebStudio przeładuje sie do końca. Zamknięcie okna przeglądarki przez całkowitym przeładowaniem może spowodować utratę treści edytowanej podstrony.
  6. Przygotowując treść do podstron należy pamietać by zamieszczane obrazki nie byly zbyt duże, by miesciły się w dostepnej przestrzeni na podstronie oraz by nie ważyły zbyt dużo (do 100 kB). Nazwy plików nie mogą zawierać polskich znaków, przerw ani znaków spoza alfabetu, najlepiej przygotowywać nazwy używając jedynie malych liter a w miejscu przerw stosowac znak podkreślenia "_".

Logowanie

Po wpisaniu adresu dostępowego do WebStudio należy się zalogować podając nazwę użytkownika i hasło, jeśli dane będą prawidłowe zobaczymy panel administracyjny.

Budowanie struktury strony oraz podstron

Po zalogowaniu pojawia się plansza prezentująca od góry linki: języki, struktura:

  1. języki (wersje językowe) - klikając ten link przechodzimy do planszy edycji języków, możemy zmodyfikować istniejący język lub utworzyć dodatkowy. Tworząc dodatkowy język wypełniamy pola: kod - tu wpisujemy oznaczenie wersji jakie pojawi się na stronie czyli np. "EN", nazwa - jest to nazwa widoczna w WebStudio dla rozpoznania z którą wersją mamy do czynienia wpisujemy np. "angielski", kodowanie - w tym miejscu wpisujemy kodowanie odpowiadające danemu językowi.
  2. struktura - jest to plansza ustawiona domyślnie prezentująca układ podstron, klikając znaczek "+" uzyskujemy rozwinięcie menu gdzie widoczne są już utworzone podstrony. Klikajac link "home" przechodzimy do planszy pozwalającej na zakładanie nowych podstron pierwszego poziomu, kliknięcie konkretnej podstrony prowadzi do edycji treści podstrony lub umożliwia założenie podstrony drugiego poziomu. W przypadku gdy wybierzemy konkretną podstronę otrzymujemy plansze z następującymi linkami:
    • strzałka w górę - pozwala na przesunięcie danej podstrony o jeden link wyżej w strukturze menu, czyli jeśli np. stworzyliśmy menu o linkach: o firmie, kontakt, oferta a chcemy by układ był: o firmie, oferta, kontakt, wówczas wchodzimy na podstrone "oferta" i klikając strzałkę przesuwamy link o jeden stopień wyżej
    • strzałka w dół - podobnie jak strzałka w górę służy do zmiany układu linków w menu
    • dodaj podstronę - opcja ta pozwala dodać podstrone podrzędna czyli stanowiącą rozwinięcie podstrony którą edytujemy. Jeśli np. chcemy utworzyć w podstronie "oferta" dodatkowy podział np. na grupy produktów to możemy dokonać tego właśnie w tym miejscu
    • edytuj treść - link ten pozwala przejść do edycji treści podstrony którą wybraliśmy, opis edycji treści został zamieszczony poniżej w punkcie "edycja treści podstrony".
    • kasuj - link ten służy do kasowania całej podstrony łącznie z usunięciem jej z menu
    • dodaj pop-up - opcja ta umożliwia stworzenie okienka pop-up pojawiającego się na podstronie którą wybraliśmy, opis tworzenia okienek pop-up został zamieszczony poniżej w punkcie "tworzenie okienek pop-up"

Edycja treści podstrony

Wybierając w strukturze układu linków konkretna podstronę przenosimy się na planszę udostępniającą między innymi link: "edytuj treść". Prowadzi on do edytora umożliwiającego bardzo wygodne wprowadzanie oraz modyfikowanie treści. Edytor składa się z pól: nazwa, nagłówek, link, okienek do zaznaczenia: widoczny w menu, nowe okno, pola edycji w którym wprowadzana jest treść oraz z zestawu narzędzi (ikonki nad polem edycji) pomocnych przy odpowiednim formatowaniu zawartości.

  • nazwa - pole to pozwala nadać odpowiednią nazwę danej podstronie która pojawiać się będzie w menu strony
  • okienko "widoczny w menu" - domyślne zaznaczenie tego okienka sprawia, iż dana podstrona widoczna jest w menu, jeśli odznaczymy okienko podstrona widoczna będzie w WebStudio, nie będzie jednak pojawiała się na stronie, jest to wygodne jeśli przygotowujemy nową podstrone i wprowadzamy na nią zmiany sukcesywnie przez wiele dni, wówczas można robić to "w ukryciu" a w momencie wprowadzenia całości zaznaczyć okienko i wówczas podstrona pojawi się w internecie
  • nagłówek - jest to tekst pojawiający się na stronie na górze podstrony, kolor, rodzaj oraz wielkość czcionki ustalone są wcześniej przez grafika
  • link - podanie linku spowoduje, że kliknięcie na daną podstronę w menu przenosić będzie użytkownika pod wskazany adres, możemy np. podłączyć pod nasz link "oferta" adres oferty naszego kontrahenta
  • okienko "nowe okno" - zaznaczenie tego okienka powoduje, że dana podstrona będzie się otwierała w nowym oknie przeglądarki, jest to szczególnie wygodne jeśli ustawiamy w polu "link" przekierowanie na obcy adres wówczas korzystnie jest by adres docelowy został uruchomiony w nowym oknie tak by okno z nasza strona nadal było widoczne na ekranie odwiedzającego
  • pole edycji oraz zestaw narzędzi do edycji - za ich pomocą możemy wprowadzić dowolna treść: tekst, zdjęcia, tabelki, listy, hiperłącza, czy zamieszczać pliki.

Zestaw narzędzi do edycji dostępny w pierwszym wierszu

- źródło dokumentu - w tym miejscu możemy przełączyć sie na tryb HTML.

- (dyskietka) powoduje zapisanie wprowadzonych zmian i działa dokładnie tak samo jak przycisk: zapisz zmiany umieszczony pod pole edycji.

- umożliwia wyczyszczenie całej zawartości edytowanej podstrony.

- (podgląd) pokazuje w osobnym oknie wygląd wprowadzonej treści bez konieczności zapisywania zmian.

to: wytnij (skrot z klawiatury ctrl+x), kopiuj (ctrl+c), wklej (ctrl+v).

- umożliwia wstawienie treści jako czystego tekstu czyli likwiduje formatowanie wstawianego fragmentu.

- pozwala na wstawienie treści z Worda z zachowaniem formatowania.

- przedstawiająca drukarke powoduje drukowanie wprowadzanej treści.

Strzałka w lewo i strzałka w prawo to odpowiednio: cofnij zmiany i ponów zmiany.

- symbolizująca lornetkę to funkcją znajdź pozwalająca na wyszukanie słowa lub fragmentu tekstu.

- umożliwia zastąpienie słowa lub fragmentu tekstu innym tekstem.

- służy do zaznaczania całej treści edytowanej podstrony.

- usuwa formatowanie zaznaczonego fragmentu.

- pozwalają kolejno na: pogrubienie, pochylenie, podkreślenie, przekreślenie linią poziomą, wstawienie indeksów: dolnego i górnego.

Zestaw narzędzi do edycji dostępny w drugim wierszu

- służą do formatowania tekstu w tzw. listach: numerowanej i wypunktowanej oraz do wcinania tekstu (zwiększanie i zmniejszanie wcięcia).

- odpowiadają za wyrównywanie zaznaczonego tekstu (do lewej, na środku, do prawej i równomierne rozłożenie na całej szerokości - justowanie).

- służą do tworzenia hiperłączy do stron zewnętrznych oraz wewnątrz strony. Uruchamiając pierwszą ikonkę (wstaw/edytuj hiperłącze) otrzymujemy okienko w którym możemy wybrać czy link ma być adresem strony www (URL) czy też adresem e-mail. Wybierając adres e-mail możemy z góry narzucić temat oraz treść, które pojawią się w wiadomości np: zapytanie ze strony. Ikonka druga likwiduje hiperłącze. Ikonka trzecia (kotwica) pozwala na wprowadzanie tzw. adresów względnych, tzn. odnośników w ramach tej samej podstrony lub serwisu przewijających treść w odpowiednie miejsce. Można to wykorzystać np. budując na początku strony spis jej treści jako listę odnośników do odpowiednich fragmentów tekstu. Przy takim rozwiązaniu wstawiamy kotwicę w miejscach do których mają kierować linki nadając im odpowiednie nazwy (np. "dol"), następnie ikonką służącą do tworzenia hiperłączy tworzymy link z wybranego słowa lub fragmentu tekstu. Gdy pojawi się okienko "Hiperłącze" należy pamiętać by zmienić protokuł na "inny" a w polu adres URL wpisywać: ?id=xx#nazwa
W adresie tym "id=xx" stanowi numer (podstawiamy zamiast xx) podstrony na ktorej zamiescilismy kotwicę (numer ten można odczytać w przeglądarce wchodząc na daną podstronę, znajduje się on na końcu adresu), "#" symbolizuje odsyłacz względny, a "nazwa" stanowi nazwę kotwicy którą stworzyliśmy. Czyli jeśli stworzyliśmy na podstronie o id=10 kotwicę o nazwie "dol" to by stworzyc względny odsyłacz do tego miejsca musimy posłużyć sie nastepującym adresem: ?id=10#dol.

- służy do wstawiania obrazka. Kliknięcie na ikonkę uruchamia okno "właściwości obrazka". Okno to zawiera pole: adres URL umożliwiające podanie linku do obrazka oraz przycisk "Przeglądaj" (jeśli w tym miejscu pojawi się informacja o błędzie należy sprawdzić czy przeglądarka nie ma zablokowanych wyskakujących okienek, jeśli ma należy je odblokować, błąd powinien ustąpić) poprzez który wchodzi się do galerii obrazków w której można wybrać włąściwy obrazek. Galerię można dzielić na katalogi (Utwórz nowy katalog) oraz wgrywać do niej pliki z własnego komputera (Wgraj nowy plik do powyższego katalogu), należy pamiętać jednak by plik był nie wiekszy niż 100 kb. Jeśli podczas próby wgrania zdjęcia wyskakuje błąd należy sprawdzić czy zdjęcie nie jest zbyt duże lub czy w przeglądarce nie jest włączona blokada wyskakujących okienek pop-up. Okno "właściwości obrazka" umożliwia ponadto określenie szerokości, wysokości obrazka, stworzenie ramki oraz ustawienie położenia obrazka względem tekstu (widok położenia obrazka względem przykładowego tekstu widoczny jest w polu "Podgląd").

WebStudio umożliwia zamieszczanie miniaturek zdjęć i linkowanie ich z powiększeniami w taki sposób by po kliknięciu na miniaturkę powiększenie pojawiało się w osobnym oknie. Uruchomienie takiego rozwiązania najwygodniej stworzyć w następujący sposób:

  • przygotować w dowolnym programie graficznym zdjęcia: miniaturki i powiększenia pamietając by miniaturki miały do 10 kb a powiększenia do 100 kb
  • poprzez omawianą ikonkę wejść do okienka "właściwości obrazka", kliknąć przycisk "Przeglądaj" (jeśli w tym miejscu pojawi się informacja o błędzie należy sprawdzić czy przeglądarka nie ma zablokowanych wyskakujących okienek, jeśli ma należy je odblokować, błąd powinien ustąpić), wgrać z dysku własnego komputera przygotowane obrazki poprzez pole "Wgraj nowy plik do powyższego katalogu" (można też przygotować sobie dwa katalogi: "miniaturki" i "powiekszenia" by zachować porządek w plikach), zamknąć okno z galerią plików
  • wybrać miejsce w treści w którym powinna się znaleźć miniaturka i umieścić tam kursor
  • wcisnąć omawianą ikonke i poprzez przycisk "Przeglądaj" (jeśli w tym miejscu pojawi się informacja o błędzie należy sprawdzić czy przeglądarka nie ma zablokowanych wyskakujących okienek, jeśli ma należy je odblokować, błąd powinien ustąpić) przejść do galerii plików i wybrać odpowiednią miniaturkę, przyciskiem "OK" zatwierdzić polecenie wprowadzenia obrazka
  • obrazek pojawi się w treści, należy go zaznaczyć klikając na jego obszarze, a następnie wybrać ikonę tworzenia hiperłącz
  • w okienku "Hiperłącze" kliknąć należy przycisk "Przeglądaj" który uruchomi galerię plików, poprzez okienko "Typ danych" należy przełączyć się na zbiór obrazków "image" i wybrać przygotowane i wgrane wcześniej powiekszenie
  • po wybraniu powiększenia zniknie okno galerii plików a w oknie "Hiperłącze" należy wejść w zakładkę "Cel", w polu "Cel" wybrać "wyskakujące okno" (PopUp)
  • w parametrach wyskakującego okna starczy podać szerokośc i wysokość okna zgodne z rozmiarami przygotowanego powiększenia obrazka oraz określić pozycję w poziomie i pionie (określenie położenia wyskakującego okna względem lewego górnego rogu ekranu)
  • jeśli obrazek w powiększeniu jest wyższy lub szerszy niż wielkość ekranu to dodatkowo w parametrach wyskakującego okna należy zaznaczyć "Paski przewijania".

- umożliwia załączenie animacji flash

- służy do budowania tabel, kliknięcie tej ikonki powoduje wyświetlenie okienka "Właściwości tabeli" w którym określamy: liczbę wierszy, liczbę kolumn, szerokość oraz wysokość tabeli, grubość ramki, odstęp między komórkami, wyrównanie (położenie tabelki na stronie), margines komórek (obszar między tekstem w komórce a jej ramką) oraz tytuł. Istnieje też możliwość zaawansowanego formatowania wyglądu tabeli, odbywa się to poprzez formatowanie poszczególnych komórek, należy ustawić kursor w danej komórce i wcisnąć prawy przycisk myszki, wyświetli się lista obejmująca: wstaw wiersz, usuń wiersze, wstaw kolumnę, usuń kolumn, wstaw komórkę, usuń komórki, połącz komórki, podziel komórkę, właściwości komórki. Ostatnia opcja powoduje wyświetlenie okna "Właściwości komórki" pozwalającego na określenie: szerokości, wysokości komórki, zawijanie tekstu, wyrównanie poziomie i pionowe treści w komórce, określenie koloru tła i koloru ramki (kolor można wybrać lub określić w sposób HTML czyli podająć np: #000000). By na przykład nadać kolor ramce całej tabelki należy nadać kolor każdej komórce po koleii.

Tabele są również bardzo przydatnym narzędziem przy organizowaniu układu treści na podstronach, wykorzystując tabele z niewidoczna ramką (w miejscu "grubość ramki" należy wpisać wartość 1) można na przykład podzielić treść na dwie kolumny lub zamieścić w jednej kolumnie zdjęcia, a w drugiej opisy do zdjęć.

- pozwala na wstawienie poziomiej linii w treści.

- prowadzi do galerii emotikonek.

- umożliwia zamieszczenie znaków specjalnych.

- uruchamia klawiatury dostępne w wielu obcych językach.

Zestaw narzędzi do edycji dostępny w trzecim wierszu

Narzedzia dostępne w trzecim wierszu służą do formatowania wprowadzanego tekstu.

Zamieszczanie plików do pobrania

WebStudio pozwala również na zamieszczanie plików do pobrania. Pliki takie należy najpierw odpowiednio przygotować by nie ważyły zbyt dużo. Następnie w treści należy wpisać słowo lub fragment tekstu, który bedzie uruchamiał pobieranie pliku np. "zamowienie.doc (200 kb)" (nazwa może być dowolna i nie musi pokrywać się z nazwą pliku, dla wygody użytkowników mozna podać rozmiar pliku). Wpisany fragment należy zaznaczyć a następnie uruchomić ikonkę służącą do wstawiania hiperłączy (wstaw/edytuj hiperłącze). Ikonka otworzy okno "Hiperłącze", poprzez przycisk "Przeglądaj" należy przejść do galerii plików i posługując się przyciskiem "Przeglądaj" oraz "Wgraj" pobrać z własnego komputera wcześniej przygotowany plik. Plik pojawi się w oknie galerii plików. Należy go kliknąć a następnie w oknie "Hiperłącze" wybrać "OK".

Zapisywanie zmian na serwerze

Gdy już dokonamy wszelkich niezbędnych modyfikacji na danej podstronie klikając przycisk: "zapisz zmiany" pod polem edycji lub ikonkę symbolizującą dyskietke w pierwszym wierszu ikonek wysyłamy wszystkie zmiany na serwer a tym samym stają się one widoczne na stronie. (należy pamiętać by przy wprowadzaniu dużej ilości treści zapisywać zmiany etapami tak by nie stracić całości gdy połączenie z serwerem zostanie przerwane). Dla pewności warto sprawdzić czy wszystko wygląda na stronie tak jak planowaliśmy.

Tworzenie okienek pop-up

Po kliknięciu konkretnej podstrony w strukturze układu linków mamy do dyspozycji funkcję: "dodaj popup". Pozwala ona na zbudowanie małego okienka które pojawi się podczas ładowania danej podstrony. Wybierając "dodaj popup" przechodzimy na plansze z poniższymi elementami:

  • tytuł okna - jest to tekst pojawiający się u góry, na niebieskiej belce okna,
  • lokalizacja okna - pozwala na ustawienie okna w odpowiednim miejscu przeglądarki tak by np. nie zakrywało innego okna lub ważnych elementów serwisu, punkt (0.0) - lewy górny róg,
  • hasło - tekst okna - treść pojawiająca się wewnątrz okna, należy uważać by tak konstruować długość wierszy by zmieściły się w dostępnej szerokości zdjęcia (podkładu), oczywiście poprzez przycisk "sprawdź" można podglądać okna tak by szybko móc modyfikować ich wygląd.
  • lokalizacja hasła - odległość treści od górnej i lewej krawędzi okna
  • czcionka - formatowanie czcionki: rodzaj czcionki, wielkość, kolor
  • podkład (foto) - tło okna, przed wypełnieniem formularza nowego okna należy odpowiednio przygotować zdjęcie lub grafikę, nadać jej odpowiednie wymiary, skompresować by nie było zbyt ciężkie a następnie zapisać jako .jpg (system przyjmuje tylko format .jpg). Poprzez pole "podkład" system pobierze zdjęcie ze wskazanej lokalizacji z lokalnego komputera.
  • link zewnętrzny - okno może kierować np. do innej strony www
  • link wewnętrzny - okno może kierować do podstron serwisu, jeśli nie wypełnimy pól: link wewnętrzny, link zewnętrzny to po kliknięciu na okno nastąpi jego zamknięcie.

Tworzenie okienka pop-up kończymy przyciskiem: "dodaj popup"

ZamknijNa tej stronie internetowej wykorzystywane są pliki cookies zbierane do celów statystycznych i wykorzystywane do poprawnego działania serwisu www.
Warunki przechowywania lub dostępu do plików cookies można zmienić w ustawieniach przeglądarki - niedokonanie zmian ustawień przeglądarki jest jednoznaczne z wyrażeniem zgody na ich zapisywanie.