Certyfikat SSL dla domeny, za darmo

Chcąc uzyskać certyfikat SSL dla domeny niekoniecznie trzeba wydawać swoje lub cudze, ciężko zarobione pieniądze. Do pozyskania certyfikatu SSL może posłużyć nam https://letsencrypt.org/. Let’s Encrypt to wystawca certyfikatów, który udostępnia usługi wystawiania certyfikatów (za darmo). Od razu pewnie zastanowicie się dlaczego za darmo, skoro wasza firma hostingowa bierze za to kasę. Wasza firma bierze kasę za być może innego rodzaju certyfikat i za obsługę ;). Let’s Encrypt kasy nie bierze bo ma sponsorów i to zapewne jest powodem „darmowości”.

Wystawiany przez Let’s Encrypt certyfikat ważny jest przez 90 dni, po których trzeba go odnowić.

Na stronach Let’s Encrypt znajadują się informacje na temat tego w jaki sposób wygenerować certyfikat SSL a ja skupię się tylko na jednym rozwiązaniu umożliwiającym pozyskanie certyfikatu na komputerze z systemem Windows i późniejszym zainstalowaniu go w docelowej witrynie WWW. Tu na marginesie uwaga, że są operatorzy hostingowi, którzy z poziomu cPanela umożliwiają wygenerowanie certyfikatu i zainstalowanie do w danej witrynie www (niestety hosting, na którym jest między innymi i ta strona nie umożliwia tego).
Czytaj dalej Certyfikat SSL dla domeny, za darmo

Shadow – cień w CSS

Tym razem też krótka podpowiedź z zakresu CSS, będzie mowa o cieniu. Cień podąża za obiektem w słoneczny dzień i nie ma szans na jego pozbycie się. W przypadku CSS standardowo cienia nie ma. Zwykły napis bez cienia wygląda tak:
Czytaj dalej Shadow – cień w CSS

Strzałki w css

Nieraz potrzebujemy na swojej stronie dodać strzałkę typu „up” lub „down”. Można wstawić obrazek ale niekoniecznie musi być to jedyne rozwiązanie. W tym celu możemy wykorzystać CSS.

Przykładowy kod do wstawienia na stronie dla strzałki do góry:

<div id="top"></div>

Czytaj dalej Strzałki w css

Wskaźniki od highcharts.

Zostałem wywołany do tablicy więc muszę odpowiedzieć. Jeden z czytelników zasugerował mi użycie biblioteki JavaScript o nazwie HighCharts https://www.highcharts.com. Jako, że zawsze lubiłem wykresiki to postanowiłem się z nią zapoznać. Na pierwszy ogień poszedł wskaźnik czyli „gauge”. By utworzyć sobie taki wskaźnik musimy mieć szkielet naszej strony gdzie wywołujemy odpowiednie skrypty wskaźnika oraz biblioteki jQuery.

Szkielet „czystej strony”:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Wykresy i wskaźniki</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    
    <script src="https://code.highcharts.com/highcharts.js"></script>
    <script src="https://code.highcharts.com/highcharts-more.js"></script>
     <script src="https://code.highcharts.com/modules/exporting.js"></script>
     <script src="https://code.highcharts.com/modules/solid-gauge.js"></script>
</head>

<body>
    
</body>
</html>    

Czytaj dalej Wskaźniki od highcharts.

Slider w innej postaci – tym razem jQuery

Poprzednio męczyłem suwak oferowany przez HTML5 a teraz będzie suwak ale z wykorzystaniem jQuery oferowany przez jQueryUI.

Na początek do sekcji head naszej strony musimy dodać linki do potrzebnych zasobów (mogą być one pobrane np. z google -> https://developers.google.com/speed/libraries/#libraries)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css"><!-- plik stylów dla jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

Czytaj dalej Slider w innej postaci – tym razem jQuery

Slider – zadawanie przez przesuwanie

Gdy pojawi się potrzeba wprowadzania wartości liczbowej to możemy posłużyć się „sliderem” (suwakiem), który znany jest od dawna w wielu środowiskach programistycznych.

Wykorzystać można do tego celu tag <input>, który z parametrem range tworzy suwak:

<input type=range">

o wyglądzie takim jak zamieszczony poniżej (obrazek z Mozilla Firefox):

suwak1Do szału toto doprowadzić nie może no ale lepiej taki niż żaden :).

Suwak możemy dostosować do własnych potrzeb. Można podać zakres minimalny i maksymalny. Można podać „skok” z jakim zmieniać będzie się wartość powiązana z suwakiem. Można dodać domyślną wartość val, którą będzie przyjmować suwak po uruchomieniu strony. Jeśli pokusimy się o takie zmiany w kodzie strony umieścić musimy coś podobnego. Oczywiście min może być wartością ujemną a step np. dziesiątkami.

<input type="range" min="0" max="40" step="0.1" val="20">

Sam suwak to trochę mało by coś sensownego z tego wyszło. Poniżej „goły suwak” oraz dwa przykłady użycia suwaka z dodatkami.

Czytaj dalej Slider – zadawanie przez przesuwanie

Glify i inne

Zapewne nie raz widzieliście na stronach przyciski (lewo, prawo, góra, dół itd.) na których znajdowały się strzałki w postaci np. trójkąta, czy też znaków „<” czy „>”. Bootstrap oferuje wiele tego rodzaju „znaczków” zwanych glifami, które mogą być zastosowane na stronach. Kilka przykładów poniżej a pełna lista na stronach bootstrap (https://getbootstrap.com/components/#glyphicons)
Czytaj dalej Glify i inne