Wordpressテーマを作成していて、カスタムショートコードがあります。ショートコードは、その中にイメージがあるコンテンツを囲んでいます。ショートコードはDOMDocumentを使ってイメージのsrcを抽出し、そのURLを使って新しいDIVの背景イメージにします。PHP DOMDocument操作は、ローカルで実行すると期待値を返しますが、ページがサーバー上で実行されているときは空です
はここに関連するコードです:
//find image src
$html = do_shortcode($content);
$doc = new DOMDocument();
libxml_use_internal_errors(true);
$doc->loadHTML($html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
$xpath = new DOMXPath($doc);
$src = $xpath->evaluate("string(//img/@src)"); # "/images/image.jpg"
echo '<script>console.log('.'"Source: '.$src.'");</script>';
$overlay_html = '';
foreach($xpath->evaluate("//*[contains(@class, 'sp-img-overlay')]") as $childNode) {
$overlay_html .= $doc->saveHtml($childNode);
}
//removes empty p tags from content
$content = do_shortcode($content);
$content = force_balance_tags($content);
$content = preg_replace('#<p>\s*+(<br\s*/*>)?\s*</p>#i', '', $content);
//removes the actual images and captions
$just_text = $content;
$just_text = preg_replace('#(<figure.*?>).*?(</figure>)#', '', $just_text);
$just_text = preg_replace("/<img[^>]+\>/i", "", $just_text);
//build output
//make src captured earlier the background image.
$output = '<div class="section-pairing full-bleed-mobile">';
$output .= '<div class="section-pairing-img full-bleed-mobile '.$img_side.' '.$values['mobile_img_size'] .'" style=" background-image:url('. $src .')">';
$output .= $overlay_html;
$output .= '</div>';
$output .= '<div class="section-pairing-text '.$text_side.'">';
$output .= $just_text;
$output .= "</div>";
$output .= "</div>";
return $output;
私は私の地元のdevの環境でこれを実行し、そのコンソールログ。 。 。
echo '<script>console.log('.'"Source: '.$src.'");</script>';
。 。 。イメージへの正しいパスを返し、ショートコードは意図したとおりに動作します。 しかし、私がサーバーに移行したとき、ページ上の他のものは正常に動作しますが、このショートコードは機能せず、コンソールログはURLなしで「ソース:」を返し、イメージはありません。
私はウェブ開発には新しく、DOMDocumentを初めて使うので、この作業をどのように行うかについての提案は感謝します。