Development/Tutorials/Plasma/Theme - Revision history

AnneW at 11:09, 15 July 2012

2012-07-15T11:09:03Z

Minio: /* Creating a Plasma Theme in 7 Easy Steps */ fixed broken link

2012-07-06T19:13:55Z

‎Creating a Plasma Theme in 7 Easy Steps: fixed broken link

Kraplax: Adding language navigation bar

2010-03-27T16:02:57Z

Adding language navigation bar

Mart: /* Creating a Plasma Theme in 7 Easy Steps */

2009-11-27T13:49:36Z

‎Creating a Plasma Theme in 7 Easy Steps

Jamboarder: /* Creating a Plasma Theme in 7 Easy Steps */

2008-05-22T01:19:41Z

‎Creating a Plasma Theme in 7 Easy Steps

Tampakrap at 12:35, 25 March 2008

2008-03-25T12:35:50Z

Tampakrap at 11:09, 20 March 2008

2008-03-20T11:09:22Z

Jamboarder: /* Testing the Theme */

2008-03-20T01:21:59Z

‎Testing the Theme

Jamboarder: /* Creating a Plasma Theme in 7 Easy Steps */

2008-03-19T00:48:43Z

‎Creating a Plasma Theme in 7 Easy Steps

Tampakrap at 23:06, 18 March 2008

2008-03-18T23:06:23Z

← Older revision		Revision as of 11:09, 15 July 2012
Line 1:		Line 1:
−	~~{{Template:I18n/Language Navigation Bar\|Development/Tutorials/Plasma/Theme}}~~	+
	A feature of Plasma is the ability to theme desktop elements using '''Scalable Vector Graphics (SVGs)'''. This means there is no need for theme authors to know C++ or any other programming language to create a great looking theme. They need only use common graphics tools many are already familiar with (e.g. Krita, Inkscape, The GIMP, Karbon, etc.). Depending on your prowess with such tools, a great looking plasma theme can be created in under an hour.		A feature of Plasma is the ability to theme desktop elements using '''Scalable Vector Graphics (SVGs)'''. This means there is no need for theme authors to know C++ or any other programming language to create a great looking theme. They need only use common graphics tools many are already familiar with (e.g. Krita, Inkscape, The GIMP, Karbon, etc.). Depending on your prowess with such tools, a great looking plasma theme can be created in under an hour.

@@ Line 8: / Line 8: @@
 # To make renaming of the theme elements easier is possible to use an Inkscape extension located at [http://websvn.kde.org/trunk/playground/artwork/Oxygen/notmart/inkscapeextensions/ this address]
 # Check to make sure that the element id for each new element is correctly set. '''''Hint''': In Inkscape you can check the element id for each object by right-clicking on the object and choosing Object Properties.''
-# Add or remove any hint element you desire.  It doesn't matter how these look, just that objects with the element ids matching the hint elements either exist or don't exist. See  [[Projects/Plasma/Theme#Backgrounds|Backgrounds]] for a description of available hint elements.
+# Add or remove any hint element you desire.  It doesn't matter how these look, just that objects with the element ids matching the hint elements either exist or don't exist. See  [[Projects/Plasma/Theme#Backgrounds_format|Backgrounds format]] for a description of available hint elements.
 # Save the SVG file.
 # Repeat steps 3 - 6 for any other plasma element for which you would like to create a new theme.

← Older revision		Revision as of 16:02, 27 March 2010
Line 1:		Line 1:
		+	{{Template:I18n/Language Navigation Bar\|Development/Tutorials/Plasma/Theme}}
	A feature of Plasma is the ability to theme desktop elements using '''Scalable Vector Graphics (SVGs)'''. This means there is no need for theme authors to know C++ or any other programming language to create a great looking theme. They need only use common graphics tools many are already familiar with (e.g. Krita, Inkscape, The GIMP, Karbon, etc.). Depending on your prowess with such tools, a great looking plasma theme can be created in under an hour.		A feature of Plasma is the ability to theme desktop elements using '''Scalable Vector Graphics (SVGs)'''. This means there is no need for theme authors to know C++ or any other programming language to create a great looking theme. They need only use common graphics tools many are already familiar with (e.g. Krita, Inkscape, The GIMP, Karbon, etc.). Depending on your prowess with such tools, a great looking plasma theme can be created in under an hour.

@@ Line 5: / Line 5: @@
 # Open the SVG file associated with the plasma element you would like to theme (panel background, clock, etc.) in an SVG editor (e.g. Inkscape, Karbon).  See [[Projects/Plasma/Theme#Current_Theme_Elements|Current Theme Elements]] if you need help understand what each SVG file does.
 # Each SVG file may have several elements (e.g. objects with element id = left, right, top, topright, center, clock face, etc.). Modify existing elements OR delete and create replacement elements.  Elements can be any SVG primitive or object group.  '''''Hint''': You can embed raster images as SVG elements if you creatively prefer raster editors like Krita, the GIMP, etc. '''Remember to embed, instead of link, each image (inkscape: effects->images->embed all images)'''.''
 # Check to make sure that the element id for each new element is correctly set. '''''Hint''': In Inkscape you can check the element id for each object by right-clicking on the object and choosing Object Properties.''
 # Add or remove any hint element you desire.  It doesn't matter how these look, just that objects with the element ids matching the hint elements either exist or don't exist. See  [[Projects/Plasma/Theme#Backgrounds|Backgrounds]] for a description of available hint elements.

@@ Line 3: / Line 3: @@
 ==Creating a Plasma Theme in 7 Easy Steps==
 # Copy and rename an existing plasma theme folder.  The new folder name can be the name of the theme.  Installed themes are stored in ''share/apps/desktoptheme/'' in either your .kde directory or your kde installation directory. You can also find Plasma themes on [http://kde-look.org KDE-Look]. Edit the '''metadata.desktop''' file in the theme folder to match your theme name. See [[Projects/Plasma/Theme#Theme_Storage|Theme Storage]] if you need help.
-# Open the SVG file associated with the plasma element you would like to theme (panel background, clock, etc.) in an SVG editor (e.g. Inkscape, Karbon).  See [[Projects/Plasma/Theme#Current_Theme_Elements|Current Theme Elements]] if you need help understand what each SVG file does.  ''Note that theming with some SVG files - '''tasks.svg''' - require KDE 4.1 or an svn version of KDE.''
+# Open the SVG file associated with the plasma element you would like to theme (panel background, clock, etc.) in an SVG editor (e.g. Inkscape, Karbon).  See [[Projects/Plasma/Theme#Current_Theme_Elements|Current Theme Elements]] if you need help understand what each SVG file does.
 # Each SVG file may have several elements (e.g. objects with element id = left, right, top, topright, center, clock face, etc.). Modify existing elements OR delete and create replacement elements.  Elements can be any SVG primitive or object group.  '''''Hint''': You can embed raster images as SVG elements if you creatively prefer raster editors like Krita, the GIMP, etc. '''Remember to embed, instead of link, each image (inkscape: effects->images->embed all images)'''.''
 # Check to make sure that the element id for each new element is correctly set. '''''Hint''': In Inkscape you can check the element id for each object by right-clicking on the object and choosing Object Properties.''
-# Add or remove any hint element you desire.  It doesn't matter how these look, just that objects with the element ids matching the hint elements either exist or don't exist. See  [[Projects/Plasma/Theme#Backgrounds|Backgrounds]] for a description of available hint elements. ''Note that some hint elements - '''hint-tile-center, hint-apply-color-scheme''' - require KDE 4.1 or an svn version of KDE.''
+# Add or remove any hint element you desire.  It doesn't matter how these look, just that objects with the element ids matching the hint elements either exist or don't exist. See  [[Projects/Plasma/Theme#Backgrounds|Backgrounds]] for a description of available hint elements.
 # Save the SVG file.
 # Repeat steps 3 - 6 for any other plasma element for which you would like to create a new theme.

@@ Line 12: / Line 12: @@
 ==Testing the Theme==
 * If you have not already done so, copy your new theme folder to the ''share/apps/desktoptheme'' directory in either your .kde folder or your kde install folder.
-* Choose the theme from the from the configure desktop dialog (may require kde restart) or edit your ''plasmarc'' file to point to the new theme.
+* Choose the theme from the Configure Desktop dialog (may require kde restart) or edit your ''plasmarc'' file to point to the new theme.
 * Carefully check the appearance of all new theme elements.
 * If you created separate non-composite themes (SVGs in the opaque folder), remember to test your theme with compositing (Desktop Effects) turned off.

@@ Line 24: / Line 24: @@
 * In Inkscape, '''turn off stroke scaling''' when objects are resized.  Inkscape may default to scaling the stroke of an object when changing its size.  This may show up in the rendered plasma theme as thin, barely-there, lines you can't seem to get rid of.
 * If you prefer raster editors like Krita and GIMP, create your particular theme in these programs first then import them into Inkscape (drag and drop of the files works fine). If you're working on a background with multiple elements (e.g. panel-background, widget background, etc.) crop the raster image into the different elements (top, bottom, right, etc.) and save as separate files before importing into Inkscape.
-* Don't forget to '''embed imported raster images'''.  By default Inkscape will import these as linked images which will not show up in plasma.
+* Don't forget to '''embed imported raster images'''.  By default Inkscape will import these as linked images which will not show up in plasma (to embed the images, go to '''Effects > Images > Embed All Images''').
 * Remember that border elements of backgrounds (top, right, bottom, left) are '''tiled''' if the ''hint-stretch-borders'' element is not present in the svg.
 * Remember that the center element of backgrounds are '''stretched''' if the ''hint-tile center'' element is not present in the svg.
 * To control how much colorization will be applied by plasma when using the ''hint-apply-color-scheme'' element, make sure the color (HSV) Value/Intensity is closer to 0 or 255 for less colorization, and closer to 127 for more colorization.  So, for example, to keep shadows from being colorized, use color (HSV) Value/Intesity of 0.
 * When testing the theme, if it looks like portions of a multi-element SVG is missing (missing borders, etc.) check the svg again to '''make sure the element ids are correct'''.
 * Perform this quick sanity check for background SVGs to help troubleshoot annoying lines and gaps between elements:
 ** ''topleft, top and topright'' elements should have the same height