回首页
Make it look better: themes & theming
让她看起来更美,主题和制作
Do you have a custom design to implement or are you looking for a fresh look with an out of the box theme?
网站如人,美之,可也。
Design and Drupal, introduction to theming
设计和Drupal,主题介绍
寻找主题
安装主题
如何做主题
Design and Drupal, introduction to theming
设计和Drupal,主题介绍
This community documentation guide is about changing the look and feel of a Drupal site. The guide coversDrupal 6 & 7andDrupal 8.
Changing Site Appearance
In the administrative settings you can modify the appearance of the theme in three ways:
Find a prefabricatedtheme provided by the Drupal communityor get one on a third-party website and modify the theme settings
Copy anexisting themeand then change or extend the code
Build a complete theme from scratch (For doing this you need to copy files from core theme and place it under sites/all/themes and do the necessary changes on .info, template, tpl and css files.)
What else can you do?
You can do more with a theme than change the appearance of an entire site. It is also possible to "theme" specific sections of a site, certain types of content, or even individual pages. For example, your theme could specify a different look for just the front page of your site.
Some other things that you can do with a theme:
Change layouts, regions, images and fonts.
Hide or display fields based on user role.
Dynamically respond to changes in content or user input.
Modify or replace text (e.g. labels or attributes) and variables generated by modules.
It's also possible toportopen source designs between other systems (Joomla!templates,WordPressthemes, etc.) and Drupal, orconvertany website layout or template into a Drupal theme.
Create a sub-theme. Your own version of a theme (existing or one that you create) that you can modify, while protecting the functionality of the original (base-theme) for update purposescreating a sub-theme.
Other Places to Explore
Overview of theme files -Structure of Drupal 6 and Drupal 7 themes files individuallyhttps://drupal.org/node/171194
Definitive Guide to Drupal 7 Theming -(Theming and Advanced Theming chapters from the Definitive Guide to Drupal 7) free online:http://themery.com/dgd7
Installing Themes -To install existing, contributed themes, please visitInstalling themes.
Contributed Themes -FreeContributed themesat drupal.org. See demos of some of them atTheme Garden. Drupal 7 themes can be previewed atdrupal7themes.arxic.com.
Custom Themes -Unique custom themes created byDrupal designersthat you can hire.
Theming Tutorials -View a number oftheming videoswhich guide you through common scenarios.
Support -Having problems? Check thetroubleshooting FAQ, in thetheming forumor contact us on IRC @ #drupal-themes.
Module Developer's Guide -Module developers can consult the module developer's guide, specificallyUsing the theme layer (Drupal 7.x)and(Drupal 6.x).
HTML and CSS techniques -See thebest practices page.
Sass techniques -See theSass Techniques and tools.
Tools, best practices and conventions
Upgrading a theme to a new version
Create custom twig templates from custom module
More theming resources and guides
Finding themes
寻找主题
本章无内容, 点击英文标题就可以寻找了。
Installing themes
安装主题
Installing themes
Last updated November 4, 2015. Created on September 16, 2007.
Edited bymgosur,NewSites,peterx,davidneedham.Log in to edit this page.
Download the theme.
You can find themes onhttp://drupal.org/project/themes, as well as some external sites. Make sure the version of the theme matches your version of Drupal. Note that themes labeled "DEV" are in a development stage. They may be written for a previous/current/future version of Drupal, and they are considered unstable and should be handled with care.
Extract the files.
When you first get the theme, it will appear in a compressed file format such as 'tar.gz'. On Windows, use a program like 7-Zip to extract it. On the Mac, you can use Stuffit Expander. To extract the file using the Unix command line:
tar-zxvf themename-drupalversionnumber.tar.gz
You should see a list of files extracted into a folder.
Upload the folder.
FTP/Copy/SCP your files to the desired themes folder in your Drupal installation. Since thethemes folder at the top level of Drupal is reserved for Drupal core themes, you should create asites/all/themes/directory for contributed (non-core) themes and put uploaded themes there. If you are running amulti-site installationof Drupal, you can create a themes folder under sites/my.site.folder and put themes there that are specific to a particular site in your installation. Themes that will be shared between all sites should be placed in sites/all/themes.
Read the directions.
If the theme has an installation file (usually INSTALL.txt and/or README.txt), read it for specific instructions. There are themes that require special treatment to function properly.
Enable the theme.
Go to "Appearance" on the main Administration menu of your site. Check the 'Enabled' box next to the theme.
Optional: Make it the active, default theme.
Check the 'default' box to make this the chosen theme for your site. Enabled alone will allow users to select the theme, if you have allowed that permission.
Click the 'Save Configuration' button at the bottom.
If you run into problems, check the themes issue queue and search the forums. If your problem hasn't already been addressed, post a question and someone will try to help you out.
Drupal 8
Drupal 8 places all core code and themes under a directory named/core./themes,/sites/all/themes, and the other Drupal 7 options are still available for your themes.
The themes still download and expand the same. When you look inside, the main differences are:
The.infofile changes to.info.yml.
The.tpl.phpfiles change to.html.twig.
The following is the README.txt from Drupal 8 directory/themes.
Place downloaded and custom themes that modify your site's appearance in this
directory to ensure clean separation from Drupal core and to facilitate safe,
self-contained code updates. Contributed themes from the Drupal community may
be downloaded athttp://drupal.org/project/themes.
It is safe to organize themes into subdirectories and is recommended to use
Drupal's sub-theme functionality to ensure easy maintenance and upgrades.
In multisite configuration, themes found in this directory are available to
all sites. In addition to this directory, shared common themes may also be kept
in the sites/all/themes directory and will take precedence over themes in this
directory. Alternatively, the sites/your_site_name/themes directory pattern may
be used to restrict themes to a specific site instance.
Refer to the "Appearance" section of the README.txt in the Drupal root
directory for further information on theming.
AttachmentSize
screencap-choose-a-theme.jpg336.16 KB
Theme HowTos
Last updated October 24, 2014. Created on May 13, 2005.
Edited bycamorim,Heine,SLIU,LeeHunter.Log in to edit this page.
The following section provides a collection of 'How-to' articles on subjects relevant to theme developers. For a selection of useful code samples, see theTheme Snippetssection.
Add Default Menu to node without menu
Clearing floats with class="clear-block"
Collapsing default fieldsets: Tidying up the theme settings form
Convert any website layout or template into a Drupal theme - easily!
Create a Views event list grouped by month
Create a new custom theme with CSS alone
Create a web / ipad / facebook page friendly site with the zeropoint theme
Creating and rendering CSS templates (eg. style.css.php)
Creating automation tools for custom themes (Gulpjs)
Customize Drupal User Profiles with CiviCRM Contact Fields
Customize the User Edit page in Drupal 7 - an example
Customize the front page template
Customizing core and/or contributed themes
Dynamic Image Headers through Taxonomy Terms
Enable submit via Enter key on Ajax forms
Hide the Node Title on a Page (6.x)
How To Add Most Recent Blog Entries by User List to Users Profile Page
How to edit ALT tag on your site logo
How to use images for NEXT and PREV links
Image stretch in Internet Explorer
Move the help/description text on node forms
Moving $tabs to a new region -- made easy
Overriding Theme Templates in Drupal 6 and 7
Porting A Joomla Template To Drupal - a simple approach.
Prototyping XHTML/CSS with Drupal
Put an HTML non breaking space ( ) in menu items titles
Recipe for two column block of recent comments
Rounded Corners in Drupal 7 (jquery corner)
Static and Dynamic Thumbnails for Facebook
Style a horizontal login block in the footer
Theming CCK fields within a content type
Tips for designing themes in Dreamweaver, GoLive etc.