Img Src Dateipfadproblem

Question

Img Src Dateipfadproblem

- 3
- 65313 2013-08-14
Um Bilder korrekt zu laden,wennichimg srcin HTML verwende,mussich dengesamten Dateipfad angeben.Mit CSSmüssteichnur Folgendes verwenden:

`background-image: url(images/morebutton.png)`

Mitimg srcmussich Folgendes verwenden:

<img src="wp-content/themes/blankslate/images/morebutton.png">

Wennich diesen Dateipfad verwende,erhalteich das Bild auf der Startseite. Wennichjedoch auf die Artikelseite klicke,wird das Bildnichtgeladen. Ich habe dasgleiche Problemmit meinem Logo,das auf der Startseite angezeigt wirdzusätzliche Seiten werdennicht angezeigt.

Kannmirjemand sagen,obmeine Dateipfadeinstellungfalschist?
To get images loaded correctly when I use img src in HTML, I have to give the entire file path. Using CSS I would only need to use:

`background-image: url(images/morebutton.png)`

With img src I have to use this:

<img src="wp-content/themes/blankslate/images/morebutton.png">

Using this file path gives me the image on the home page, however when I click through to the article page, the image doesnt load.. I'm having the same issue with my logo, it shows on the homepage, any additional pages it doesnt show.

Can anyone tell me if the file path setup I have is incorrect?
images

- Lesen Siemehr über * relative * und * absolute * Links.Das Konzeptist weit verbreitet. Wenn Sie HTML-Inhalteerstellen,sollten Sie dies wissen.Sie können dannjedes verwenden,wie Sieesfür richtig halten,aber zuerstmüssen Sie verstehen,wieesfunktioniert.Die URLin der CSS-Dateiistbeispielsweiseimmer relativ zum Speicherort der CSS-Datei.Der SRC-Linkistimmer relativ zum Speicherort des angeforderten HTML-Codes. Er kann daher variieren,wenn Sie den HTML-Code an verschiedenen Speicherorten verwenden.
  
  Read about *relative* and *absolute* links. The concept is common and if you create HTML content, you should know about this. You then can use each as you see fit, but first you need to understand how it work. The URL in the CSS file for example is always relative to the CSS file location. The SRC link is always relative to the location of the requested HTML, so it can vary if you use the HTML in different locations.
  - 0
  - 2013-08-14
  - hakre

3 Antworten

Stimmen

- 2
- 2013-08-14
Versuchen Sie Folgendes:

<img src="<?php echo get_bloginfo( 'template_directory' ); ?>/images/morebutton.png" />

Normalerweise lasseich WordPress den Datenverkehr so weit wiemöglich leiten,um Konflikte zu vermeiden.Esist definitiv aucheinfacher,immer auf die vordefinierten Funktionen zu schauen,diein den Kerneingebaut wurden.
Try this:

<img src="<?php echo get_bloginfo( 'template_directory' ); ?>/images/morebutton.png" />

I typically let WordPress direct traffic as much as possible to avoid any conflicts. It's definitely easier as well to always look to the predefined functions that have been built into the core.
- Ich lade die Dateien direkt hoch. Wennichetwasmehr über PHP wissen würde,würdeich dies versuchen. Die obige Antwort hatfürmichfunktioniert!Schätzen Sie die Antwort
  
  I'm uploading the files directly, if I had a little more knowledge with php I would attempt this, the above answer worked for me! Appreciate the reply
  - 0
  - 2013-08-14
  - excessive34
- 1
- 2015-10-01
Sie können diesen relativen Pfad verwenden:

<img src='/wp-content/themes/blankslate/images/morebutton.png'>

Der / vor dem Pfad weist den Browser an,in das Stammverzeichnis zu wechseln undnach dem Ordner wp-content zu suchen und von dort ausfortzufahren.

Alternativ können Sieimmer den absoluten URL-Pfadin img src verwenden. Wie

<img src='http://yourdomain.com/wp-content/themes/blankslate/images/morebutton.png'>

Siehe auch hier,wie Sie die Initialenach oben oder unten verschieben Ordner Ihrer relativen Pfade
You can use this relative path:

<img src='/wp-content/themes/blankslate/images/morebutton.png'>

The / before the path tells the browser to go to the root directory and search for the wp-content folder and go from there.

Alternatively you can always use the absolute url path in img src. Like

<img src='http://yourdomain.com/wp-content/themes/blankslate/images/morebutton.png'>

see also here how to move up or down the initial folders of your relative paths
- Quelle
- IXN

Kumar · Accepted Answer · 2013-08-14

7

2013-08-14

Nein,Ihre Dateipfadeinstellungist korrekt. Siemüssen den absoluten Pfadin Ihrem Bild angeben,damit Bilder auf andere Seitengeladen werden können,da sich der relative Pfadin

ändern würde

  http://yourwebsite.com/page/wp-content/themes/blankslate/images/morebutton.png

und stattdessen solltees

sein

 http://yourwebsite.com/wp-content/themes/blankslate/images/morebutton.png

Sie sollten alsoin Ihrerfunction.phpeine Konstantefür den Pfad zum Bildverzeichnis definieren und diese dannin img src verwenden.

   if( !defined(THEME_IMG_PATH)){
   define( 'THEME_IMG_PATH', get_stylesheet_directory_uri() . '/images' );
  }

und dann können Sie dasimg-Tag als

verwenden

  <img src="<?php echo THEME_IMG_PATH; ?>/morebutton.png" alt=""/>

Das würde Ihr Problem lösen.Sie können die Konstante überallin Ihrem Thema verwenden,waspraktischist.

No your file path setup is correct, you need to provide the absolute path in you img src for images to load on other pages as relative path would change to,

 http://yourwebsite.com/page/wp-content/themes/blankslate/images/morebutton.png

and instead it should be

http://yourwebsite.com/wp-content/themes/blankslate/images/morebutton.png

So you should define a constant in your function.php for path to image directory, and then use it in img src.

  if( !defined(THEME_IMG_PATH)){
   define( 'THEME_IMG_PATH', get_stylesheet_directory_uri() . '/images' );
  }

and then you can use img tag as

 <img src="<?php echo THEME_IMG_PATH; ?>/morebutton.png" alt=""/>

That would solve your issue. You can use the constant anywhere in your theme, handy to use.

Quelle
Kumar

Sie können auch die relativen Pfade übernehmen.Am Ende wird der Browsertrotzdemeinen absoluten Link darauserstellen.Das Wichtigsteist,dass der vom Browsererstellte absolute Link korrektist.Da Sie wissen,wie der Browser diesen Linkerstellt,sind die Regelnin [* 5.Referenzauflösung (RFC 3986 - URI (Uniform Resource Identifier): Generische Syntax) *] (http://tools.ietf.org/html/rfc3986#section-5).Ich würde sagen,es lohnt sich zu wissen,wann Sie HTMLerstellen.

You can also adopt the relative paths. In the end, the browser will create an absolute link out of it anyway. The most important thing is that the browser created absolute link is correct. Knowing how the browser constructs that link is important, the rules are in [*5. Reference Resolution (RFC 3986 - Uniform Resource Identifier (URI): Generic Syntax)*](http://tools.ietf.org/html/rfc3986#section-5). I'd say it's worth to know about when you're creating HTML.
- 0
- 2013-08-14
- hakre
Laut Dokumentation können Sie PHPnichtin eine WordPress-Seiteeinfügen.Wogenau setzen Sie diesen Codeein?

According to the documentation you cannot put php into a wordpress page. Where exactly are you putting this code?
- 0
- 2020-03-21
- Paul McCarthy
Dies wirdin die Themendatei aufgenommen.

This is being added in theme's file.
- 0
- 2020-03-22
- Kumar