htaccess i przekierowanie CSS z linkiem absolutnym

htaccess i przekierowanie CSS z linkiem absolutnym
MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Witam, to mój pierwszy post na tym forum. Proszę o wyrozumiałość. Jestem grafikiem, który dopiero uczy się programowania.
Mój problem:

Mam na komputerze postawiony serwer do developingu/testowania stron www. Przy pomocy MAMP, ale to chyba nieistotne. Co mam wpisać w pliku .htaccess, aby poprawnie przekierowywało pliki CSS do potrzebnego mi w danym momencie folderu?

W ramach testów udało mi się np. podmienić plik style.css na test.css. Strona z ustawionym stylem style.css wygląda zgodnie z tym co mam w test.css, czyli wszystko niby działa.
Obecnie mój plik .htaccess wygląda tak:

Kopiuj
RewriteEngine on
RewriteRule ^css/(.*)?$ /Users/username/Sites/sitename/css/test.css [NC,L]

Działa to jednak tylko dla linków relatywnych, gdy CSS na stronie mam podpięte tak:

Kopiuj
<link href="css/style.css" rel="stylesheet" type="text/css">

Potrzebuję jednak mieć CSS jako link absolutny:

Kopiuj
<link href="/css/style.css" rel="stylesheet" type="text/css">

Wtedy przestaje działać ta podmiana. CSS się w ogóle nie ładuje. Żaden. A w konsoli przeglądarki mam taki błąd:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8888/css/style.css
Jak widać po linku z błędu, przeglądarka szuka pliku w miejscu localhost:8888/css/style.css przez ten absolutny link. Jeśli już, to powinna chyba szukać w localhost:8888/sitename/css/style.css

Pomocy. Nie ogarniam tego.

dodanie znaczników <code class="html"> - fp

edytowany 3x, ostatnio: flowCRANE
A1
  • Rejestracja:ponad 12 lat
  • Ostatnio:około 3 lata
  • Postów:311
0

próbowałeś w .htaccess do tej regułki dodać znak / przed css/(.*) ?

MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Tak. Gdy zmieniłem link do CSS na absolutny:

Kopiuj
<link href="/css/style.css" rel="stylesheet" type="text/css">

próbowałem też:

Kopiuj
RewriteEngine on
RewriteRule ^/css/(.*)?$ /Users/username/Sites/sitename/css/test.css [NC,L]

Efekt jest ten sam. CSS się w ogóle nie ładuje. W konsoli przeglądarki mam taki błąd:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8888/css/style.css
Czyli wciąż szuka tego pierwszego pliku css tam, gdzie go nie ma. Można się do niego dostać wpisując w przeglądarce localhost:8888/sitename/css/style.css lub file:///Users/username/Sites/sitename/css/style.css

dodanie znaczników `` i <code class="html"> - fp

edytowany 2x, ostatnio: flowCRANE
A1
  • Rejestracja:ponad 12 lat
  • Ostatnio:około 3 lata
  • Postów:311
0

spróbuj może tak
RewriteRule ^/css/(.*)?$ /sitename/css/test.css [NC,L]
lub bez tego / przed css/(.*)

MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Nie działa. Pytanie czy edycja tej drugiej cześci (w której podaję ścieżkę do test.css) jest konieczna? Cały czas pokazuje mi błąd, że nie znaleziono tego pierwszego pliku, czyli style.css. Czy nie trzeba zmienić tylko tego pierwszego wpisu po RewriteRule?

MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Dodam jeszcze, że po zmianie CSS na link absolutny:

Kopiuj
<link href="/css/style.css" rel="stylesheet" type="text/css">

próbowałem też w .htaccess taki kod:

Kopiuj
RewriteEngine on
RewriteRule . /Users/username/Sites/sitename/css/test.css [NC,L]

Ta kropka po RewriteRule powinna, jeśli dobrze rozumiem, przekierować każde zapytanie do pliku test.css. I tak się dzieje. Pokazuje się on wtedy jako tekst w oknie przeglądarki. Wydaje się to potwierdzać, że link do test.css jest wpisany prawidłowo. Co więc wpisać zamiast ^/css/(.*)?$ ?

dodanie znacznika <code class="html"> - fp

edytowany 1x, ostatnio: flowCRANE
A1
  • Rejestracja:ponad 12 lat
  • Ostatnio:około 3 lata
  • Postów:311
0

u mnie działa takie coś RewriteRule ^css/(.*)?$ css/style.css [NC,L]

MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

U mnie też, ale tylko gdy CSS jest zapisany na stronie jako link relatywny:

Kopiuj
<link href="css/style.css" rel="stylesheet" type="text/css">

Jeśli zmieniam na link absolutny:

Kopiuj
<link href="/css/style.css" rel="stylesheet" type="text/css">

to przestaje działać prawidłowo ten zapis z .htaccess. Ponownie mam błąd:

Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:8888/css/style.css

dodanie znaczników <code class="html"> - fp

edytowany 1x, ostatnio: flowCRANE
A1
właśnie gdy dam u siebie absolutnie, to też ten zapis który wyzej podalem, działa dalej prawidłowo
MA
Hmm… A próbowałeś zrobić rewrite na innego CSSa? Np. z innym kolorem jakiegoś elementu, żeby było widać zmianę? W Twoim przykładzie link kieruje do tego pierwszego CSSa, czyli kieruje sam do siebie. Pytanie też czy testujesz na localhost. Co masz wpisane w adresie przeglądarki? Ja mam http://localhost:8888/sitename/ lub http://localhost:8888/sitename/index.php. W obu przypadkach nie działa to przekierowanie. W obu ten wpis ^css/(.*)?$ kieruj do http://localhost:8888/css/style.css, a tam tego pliku nie ma. Masz pomysł o co może chodzić?
MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Sprawdziłem jeszcze jedną rzecz. Skopiowałem folder CSS do /Users/username/Sites/, który to folder jest głównym katalogiem na http://localhost:8888/
Przy deklaracji CSS jako link absoltny plik CSS się teraz wczytał, ale wciąż nie działa to przekierowanie.

Być może błędnie rozumiem działanie .htaccess. Czy skoro strona http://localhost:8888/sitename/index.php odwołuje się do pliku CSS z adresu http://localhost:8888/css/style.css, to który plik .htaccess odpowiada za jego przekierowanie? Ten z folderu http://localhost:8888/sitename/ czy z folderu http://localhost:8888/css/

Zobacz pozostałe 3 komentarze
MA
OK, po prostu nie wiedziałem, że to jakiś wymóg na tym forum, żeby zaznaczać jaki konkretnie to kod. Masz oczywiście rację. Jak pokoloruje, to jest czytelniej. Będę tak zaznaczał.
flowCRANE
Bo nie zauważyłeś i nie przeczytałeś tego wątku - Formatowanie treści postów na forum :)
MA
Tak, nie zauważyłem. Dzięki za linka, sporo cennych informacji.
flowCRANE
Wiesz, to nie chodzi o mnie, bo dla mnie to kilka kliknięć aby dodać znaczniki, jednak im ciekawiej przedstawisz swój problem w poście, tym chętniej użytkownicy się z nim zapoznają i pomogą; A chyba każdemu pytającemu na tym zależy, aby otrzymać pomoc w jak najkrótszym czasie;
MA
Jasne. Masz rację. Ja to pisałem bez ironii, że dziękuję za linka, i że się przyda.
MA
  • Rejestracja:około 11 lat
  • Ostatnio:około 11 lat
  • Postów:8
0

Być może źle się do tego zabrałem i niepotrzebnie trochę skomplikowałem sytuację. To co chcę osiągnąć, to takie skonfigurowanie lokalnego serwera, żebym mógł testować na swoim komputerze strony www, nad którymi pracuję. Problem polega na tym, że moje pliki css są w katalogu localhost:8888/sitename/css/style.css i kiedy deklaruję je na stronie jako /css/style.css, przeglądarka szuka ich w localhost:8888/css/style.css. Co jest logiczne, ale niepożądane, bo tych plików tam nie ma.

Znalazłem całkiem proste, ale nie idealne rozwiązanie. W preferencjach MAMP, w zakładce Apache zmieniłem Document Root na /Users/username/Sites/sitename, aby ten folder był głównym, kiedy wpisuję localhost:8888/ w przeglądarce. Wtedy CSS z absolutnym URI działa, jest poprawnie wyświetlany.

Ale… Czy jest inne rozwiązanie? Czy mogę osiągnąć ten sam efekt korzystając z pliku .htaccess, abym mógł zostawić w preferencjach MAMP Document Root ustawione na /Users/username/Sites/, czyli z wszystkimi moimi stronami? Jak przekierować dla konkretnej strony localhost:8888/ na localhost:8888/sitename/ korzystając z .htaccess? Szukałem w internecie, próbowałem kilku sposobów. Bez skutku.

A1
a załączając cssa nie lepiej dac /sitename/css/style.css ?
MA
Nie, bo jak przeniosę na serwer online, to musiałbym dla css (ale też obrazków i skryptów) zmieniać link, np. z /sitename/css/style.css na www.sitename.com/css/style.css. Chodzi o to, żeby css podlinkowane jako /css/style.css działało zarówno online, jak i na localhost.
Kliknij, aby dodać treść...

Pomoc 1.18.8

Typografia

Edytor obsługuje składnie Markdown, w której pojedynczy akcent *kursywa* oraz _kursywa_ to pochylenie. Z kolei podwójny akcent **pogrubienie** oraz __pogrubienie__ to pogrubienie. Dodanie znaczników ~~strike~~ to przekreślenie.

Możesz dodać formatowanie komendami , , oraz .

Ponieważ dekoracja podkreślenia jest przeznaczona na linki, markdown nie zawiera specjalnej składni dla podkreślenia. Dlatego by dodać podkreślenie, użyj <u>underline</u>.

Komendy formatujące reagują na skróty klawiszowe: Ctrl+B, Ctrl+I, Ctrl+U oraz Ctrl+S.

Linki

By dodać link w edytorze użyj komendy lub użyj składni [title](link). URL umieszczony w linku lub nawet URL umieszczony bezpośrednio w tekście będzie aktywny i klikalny.

Jeżeli chcesz, możesz samodzielnie dodać link: <a href="link">title</a>.

Wewnętrzne odnośniki

Możesz umieścić odnośnik do wewnętrznej podstrony, używając następującej składni: [[Delphi/Kompendium]] lub [[Delphi/Kompendium|kliknij, aby przejść do kompendium]]. Odnośniki mogą prowadzić do Forum 4programmers.net lub np. do Kompendium.

Wspomnienia użytkowników

By wspomnieć użytkownika forum, wpisz w formularzu znak @. Zobaczysz okienko samouzupełniające nazwy użytkowników. Samouzupełnienie dobierze odpowiedni format wspomnienia, zależnie od tego czy w nazwie użytkownika znajduje się spacja.

Znaczniki HTML

Dozwolone jest używanie niektórych znaczników HTML: <a>, <b>, <i>, <kbd>, <del>, <strong>, <dfn>, <pre>, <blockquote>, <hr/>, <sub>, <sup> oraz <img/>.

Skróty klawiszowe

Dodaj kombinację klawiszy komendą notacji klawiszy lub skrótem klawiszowym Alt+K.

Reprezentuj kombinacje klawiszowe używając taga <kbd>. Oddziel od siebie klawisze znakiem plus, np <kbd>Alt+Tab</kbd>.

Indeks górny oraz dolny

Przykład: wpisując H<sub>2</sub>O i m<sup>2</sup> otrzymasz: H2O i m2.

Składnia Tex

By precyzyjnie wyrazić działanie matematyczne, użyj składni Tex.

<tex>arcctg(x) = argtan(\frac{1}{x}) = arcsin(\frac{1}{\sqrt{1+x^2}})</tex>

Kod źródłowy

Krótkie fragmenty kodu

Wszelkie jednolinijkowe instrukcje języka programowania powinny być zawarte pomiędzy obróconymi apostrofami: `kod instrukcji` lub ``console.log(`string`);``.

Kod wielolinijkowy

Dodaj fragment kodu komendą . Fragmenty kodu zajmujące całą lub więcej linijek powinny być umieszczone w wielolinijkowym fragmencie kodu. Znaczniki ``` lub ~~~ umożliwiają kolorowanie różnych języków programowania. Możemy nadać nazwę języka programowania używając auto-uzupełnienia, kod został pokolorowany używając konkretnych ustawień kolorowania składni:

```javascript
document.write('Hello World');
```

Możesz zaznaczyć również już wklejony kod w edytorze, i użyć komendy  by zamienić go w kod. Użyj kombinacji Ctrl+`, by dodać fragment kodu bez oznaczników języka.

Tabelki

Dodaj przykładową tabelkę używając komendy . Przykładowa tabelka składa się z dwóch kolumn, nagłówka i jednego wiersza.

Wygeneruj tabelkę na podstawie szablonu. Oddziel komórki separatorem ; lub |, a następnie zaznacz szablonu.

nazwisko;dziedzina;odkrycie
Pitagoras;mathematics;Pythagorean Theorem
Albert Einstein;physics;General Relativity
Marie Curie, Pierre Curie;chemistry;Radium, Polonium

Użyj komendy by zamienić zaznaczony szablon na tabelkę Markdown.

Lista uporządkowana i nieuporządkowana

Możliwe jest tworzenie listy numerowanych oraz wypunktowanych. Wystarczy, że pierwszym znakiem linii będzie * lub - dla listy nieuporządkowanej oraz 1. dla listy uporządkowanej.

Użyj komendy by dodać listę uporządkowaną.

1. Lista numerowana
2. Lista numerowana

Użyj komendy by dodać listę nieuporządkowaną.

* Lista wypunktowana
* Lista wypunktowana
** Lista wypunktowana (drugi poziom)

Składnia Markdown

Edytor obsługuje składnię Markdown, która składa się ze znaków specjalnych. Dostępne komendy, jak formatowanie , dodanie tabelki lub fragmentu kodu są w pewnym sensie świadome otaczającej jej składni, i postarają się unikać uszkodzenia jej.

Dla przykładu, używając tylko dostępnych komend, nie możemy dodać formatowania pogrubienia do kodu wielolinijkowego, albo dodać listy do tabelki - mogłoby to doprowadzić do uszkodzenia składni.

W pewnych odosobnionych przypadkach brak nowej linii przed elementami markdown również mógłby uszkodzić składnie, dlatego edytor dodaje brakujące nowe linie. Dla przykładu, dodanie formatowania pochylenia zaraz po tabelce, mogłoby zostać błędne zinterpretowane, więc edytor doda oddzielającą nową linię pomiędzy tabelką, a pochyleniem.

Skróty klawiszowe

Skróty formatujące, kiedy w edytorze znajduje się pojedynczy kursor, wstawiają sformatowany tekst przykładowy. Jeśli w edytorze znajduje się zaznaczenie (słowo, linijka, paragraf), wtedy zaznaczenie zostaje sformatowane.

  • Ctrl+B - dodaj pogrubienie lub pogrub zaznaczenie
  • Ctrl+I - dodaj pochylenie lub pochyl zaznaczenie
  • Ctrl+U - dodaj podkreślenie lub podkreśl zaznaczenie
  • Ctrl+S - dodaj przekreślenie lub przekreśl zaznaczenie

Notacja Klawiszy

  • Alt+K - dodaj notację klawiszy

Fragment kodu bez oznacznika

  • Alt+C - dodaj pusty fragment kodu

Skróty operujące na kodzie i linijkach:

  • Alt+L - zaznaczenie całej linii
  • Alt+, Alt+ - przeniesienie linijki w której znajduje się kursor w górę/dół.
  • Tab/⌘+] - dodaj wcięcie (wcięcie w prawo)
  • Shit+Tab/⌘+[ - usunięcie wcięcia (wycięcie w lewo)

Dodawanie postów:

  • Ctrl+Enter - dodaj post
  • ⌘+Enter - dodaj post (MacOS)