Relatieve links in CSS, na verplaatsing van Wordpress

Ik heb een blog gemaakt met Wordpress over een tijdelijk testdomein. Ik zet het in de hoofddirectory, niet in een map. Nu wil ik het verplaatsen naar de juiste website, in een map. Ik kan alle MySQL-waarden voor de site-URL bijwerken en de relatieve padlinks werken prima.

Het probleem is dat ik mijn CSS-padkoppelingen niet kan laten werken. Ik realiseer me dat mijn probleem is dat ze relatief zijn ten opzichte van het CSS-bestand, in het WordPress-thema en niet op de pagina. Maar hoe kan ik dit oplossen?

Hier is een voorbeeld:

#topNav {background:#3a93c3 url(wp-content/uploads/2011/07/blueNav.jpg) repeat-x;}

Ik heb geprobeerd om './', '../' en '../../' aan het begin toe te voegen, maar het werkt helemaal niet.

Vraag

Waarom werken relatieve paden niet in CSS op mijn WordPress-site?

2
Wat is de URL naar uw CSS-bestand? U zou een combinatie van ../ moeten kunnen gebruiken
toegevoegd de auteur Abhi Beckert, de bron
Heeft u actieve WP-plug-ins, die de CSS kunnen mangel? (Zoals een soort mijnwerker of zo.) Caching-plug-ins? Enig van die?
toegevoegd de auteur Boldewyn, de bron
Nee, ik heb geen plug-ins geïnstalleerd, anders dan de standaard akismet en hello dolly.
toegevoegd de auteur bozdoz, de bron
Ik weet het niet zeker. Alles wat ik heb geïnstalleerd, sinds de installatie van WordPress, was het standaardonderdeel. Ik denk niet dat er plug-ins zijn geïnstalleerd. Ik zal kijken of ik erachter kan komen.
toegevoegd de auteur bozdoz, de bron
Ik denk dat het probleem is dat het op een WordPress-site staat. Geen combinatie van ../ doet iets. Als ik bijvoorbeeld ../../../ typ, is de URL in de CSS example.com/blog/wp-content/themes/boilerplate /../../../ & hellip; . Welke niet duidelijk werkt.
toegevoegd de auteur bozdoz, de bron
Is mijn beste/enige optie om alles naar url te veranderen (/blog/wp-content/uploads/2011/07/blueNav.jpg)?
toegevoegd de auteur bozdoz, de bron
wat is het absolute pad van uw CSS-bestand en van de map wp-content?
toegevoegd de auteur Nathan Manousos, de bron

4 antwoord

je moet echt geen themafoto's in de upload-map plaatsen. je zou echt je thema-afbeeldingen moeten opslaan in je themamap. net zoals

wp-content/
    themes/
        mytheme/
            images/
                1.jpg
            style.css

dus in je CSS kun je het gewoon doen

background:transparent url(images/1.jpg);
9
toegevoegd
ik denk dat dat is waar ik tegen opriep. je moet de basistag niet gebruiken. maar zolang het werkt. ty.
toegevoegd de auteur Funky Dude, de bron
Oh wacht. ik denk dat je gewoon achtergrond kunt doen: transparante URL (images/1.jpg);
toegevoegd de auteur Funky Dude, de bron
je hebt niet per se een basistag in je sjabloon zoals example.com/blog/ & quot ; />
toegevoegd de auteur Funky Dude, de bron
Funky Dude, ik geef je de +50 bounty-punten voor het louter vermelden van basistags. Hoewel het de vraag niet beantwoordde waarom mijn URL's niet werkten, deed het me beseffen dat het gebruik van basistags waarschijnlijk ideaal is, om relatieve links in sjablonen in mappen en domeinnamen te behouden. Bedankt :)
toegevoegd de auteur bozdoz, de bron
Ik heb de URL gewijzigd en de afbeelding gevonden. Waarom is het dat ../ de URL niet lijkt te beïnvloeden? Ik bedoel, toen het in de originele map was?
toegevoegd de auteur bozdoz, de bron
Waarom zou een transparante achtergrond helpen?
toegevoegd de auteur bozdoz, de bron
Ik heb de broncode doorzocht op "basis". Zegt "niet gevonden".
toegevoegd de auteur bozdoz, de bron
Werkte niet. Het verandert de URL in dit: h t t p: //www.example.com/blog/wp-content/themes/boilerplate/../ima‌ ges/blueNav.jpg Merk op dat het de ../ in de URL heeft geplaatst.
toegevoegd de auteur bozdoz, de bron
Ik zal dit proberen, gewoon voor de lol, en ga zo snel mogelijk terug naar je
toegevoegd de auteur bozdoz, de bron

U kunt ook de/gebruiken die de root van uw website is. Dus zoiets als url (/ jouwmap/wp-inhoud/...

Als u relatieve paden wilt gebruiken, moet u naar de juiste map gaan. Met de ../ die je eerder hebt gebruikt. ../ 1 dir omhoog, voeg nog een ../ 2 dir's toe, enzovoort.

0
toegevoegd
Relatieve paden werken in uw CSS-bestanden, ze zijn solide betrouwbaar. Maar u kunt ze verkeerd gebruiken. Kun je je vraag bewerken om meer details op te nemen, zoals wat de URL is voor het css-bestand?
toegevoegd de auteur Abhi Beckert, de bron
Waarom werkt het niet dan?
toegevoegd de auteur bozdoz, de bron
Ik denk dat het probleem is dat het een WordPress-site is. Ik denk dat er iets gebeurt wanneer WordPress het CSS-bestand verwerkt. Ik kan relatieve URL's krijgen om te werken op mijn andere sites, alleen deze niet.
toegevoegd de auteur bozdoz, de bron
De relatieve paden lijken niet te werken in mijn css-bestanden.
toegevoegd de auteur bozdoz, de bron
@bozdoz Nopes, WordPress is absoluut niet verantwoordelijk. Het "verwerkt het CSS-bestand" helemaal niet, het stijlblad is opgenomen in de <head> van het thema zoals het zou zijn op elke andere website. Relatieve paden kunnen ook in wp worden gebruikt.
toegevoegd de auteur Johannes Pille, de bron

U kunt Server-side-scripting gebruiken in CSS-bestand , hiermee krijgt u toegang tot de globale variabelen van uw webserver en dynamisch matchen met elke server waar u naartoe implementeert.

Zie Scripting aan de server in CSS-bestanden voor stappen om dit te implementeren.

0
toegevoegd
Het is een goed idee in het algemeen, maar in dit voorbeeld is het veel gemakkelijker voor mij om gewoon een zoekopdracht te doen en te vervangen om absolute paden in de CSS te maken.
toegevoegd de auteur bozdoz, de bron
Dat zou een goed idee zijn, maar dit staat op een WordPress-site. Ik probeer een reeds gemaakte sjabloon te manipuleren. WordPress lijkt de URL te veranderen, maar het verwerkt de CSS-bestanden.
toegevoegd de auteur bozdoz, de bron
U kunt dit doen met WordPress, volg eenvoudigweg de instructies in de link waarnaar ik verwijs, en voeg in uw WordPress-thema's header.php een stylesheetkoppeling toe aan het css.php-bestand en u bent in de business. Laat me weten of je een codevoorbeeld nodig hebt.
toegevoegd de auteur Virgil Shelton, de bron

Ik heb net de bedrijfsblog van mijn bedrijf bekeken en ik heb een paar verschillende manieren, er was een oud thema dat legacy was en een nieuw thema dat ik maakte.

Eerst gebruikte het oorspronkelijke basisthema absolute paden:

#blogTour {
    background: url('http://www.domain.com/wp-content/uploads/2010/09/signup.png');
}

Dit was over het algemeen niet ideaal omdat ik blogs moest regionaliseren, ze zouden een andere URL hebben en ik wilde geen PHP-variabelen gebruiken ($ SERVER ['DOCUMENT_ROOT']), misschien kun je dat wel!

Over het nieuwe thema dat ik heb gemaakt, heb ik de items onder de themamap geplaatst ... kun je de afbeeldingen in de themamap plaatsen?

#blogFeed {
    background: url('_images/icons/blog-feed.png');
}

Probeer tenslotte de inhoud van de URL in te pakken met een back-ticks url ('inhoud'), ik herinner me ergens te lezen dat wanneer je CSS door een preprocessor pompt (Wordpress/PHP) het over het algemeen een goede gewoonte is om je strings met back-ticks in te pakken.

0
toegevoegd
geen geluk. back-ticks lijken niets te doen.
toegevoegd de auteur bozdoz, de bron