在Drupal 7中爲圖像字段添加類

Question

我已經將圖像字段添加到內容類型「基本頁面」，並使用「管理顯示」選項使其顯示在頁面的頂部。然而，圖像上沒有樣式，我不能爲我的生活弄清楚如何向圖像添加類，以便我可以添加樣式。

Answer 1

如果您使用的是CCK，那麼幾乎可以肯定有一個類已經與圖像相關聯（或至少是一個包裝它的div類）。 CCK幾乎涵蓋了課堂上的所有內容。嘗試右擊圖像，然後單擊檢查元素進行仔細檢查。

如果您確實需要添加一個類，您可以使用Theme Developer module來找出要覆蓋的主題函數或模板文件。查看Theme Developer screencast for more details。

Answer 2

如果您只需要定位CSS，上述答案將有所幫助。但是我需要在IMG標籤上添加一個類。這是我解決問題的方式。這可能不是最好的方式，當然也不是唯一的方式，但它是一種有效的「Drupal方式」並且可行。打開您的模板的template.php文件。

粘貼以下功能，您必須修改和自定義您的使用場景。例如，您必須將<TEMPLATENAME>替換爲您的模板名稱，並根據需要添加或減去類，以及其他內容，如您所見。

function <TEMPLATENAME>_preprocess_image(&$variables) { 
    // If this image is of the type 'Staff Photo' then assign additional classes to it: 
    if ($variables['style_name'] == 'staff_photo') { 
     $variables['attributes']['class'][] = 'lightbox'; 
     $variables['attributes']['class'][] = 'wideborder'; 
    } 
} 

我創建了一個「如果」語句來確定上課的時候應該添加到圖像，但你必須要自定義你喜歡的 - 如果你想在所有的A類，你可能完全消除像場圖像，或者你可能會說：「如果 drupal_is_front_page（）」如果你只想把它應用在頭版等

在我的情況，我創建了一個影像風格（配置>新聞>圖片樣式）爲工作人員照片添加if子句並僅將我的首選類應用於指定圖像樣式的圖像。我認爲這是一個很好的做法，但你可以做你喜歡的事情。

現在，無論何時我正在查看包含圖像樣式爲「Staff Photo」的圖像字段的節點，這些類都會神奇地出現在IMG標記中，這正是我所需要的。

Answer 3

如果使用此函數，則Drupal會添加類，但會在首頁顯示錯誤「Notice：Undefined index：style_name in template_preprocess_image ..」。

我粘貼「_style」並確定。

function <TEMPLATENAME>_preprocess_image_style(&$variables) { 
    // If this image is of the type 'Staff Photo' then assign additional classes to it: 
    if ($variables['style_name'] == 'staff_photo') { 
     $variables['attributes']['class'][] = 'lightbox'; 
     $variables['attributes']['class'][] = 'wideborder'; 
    } 
}