Title: Move header text into image Last modified: August 20, 2016 --- # Move header text into image * Resolved [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/) * Hi All, * Can anyone tell me how to move the header text of my website into the image? I saw a website that did this using twentytwelve and would like a similar look. I see a code for moving the header above the image on forum discussions, but i want something different. I am new to this so taking it a step or problem/challenge at a time. * —————————– This is my website, so far, I recently developed a child theme for twenty twelve and will change the image. [http://sesamesuban.com/](http://sesamesuban.com/)————————————— this is the header look and menu I would like to have.. [http://kojikis.wordpress.com/](http://kojikis.wordpress.com/) * please advice on any tips. -amma Viewing 15 replies - 1 through 15 (of 20 total) 1 [2](https://wordpress.org/support/topic/move-header-text-into-image/page/2/?output_format=md) [→](https://wordpress.org/support/topic/move-header-text-into-image/page/2/?output_format=md) * [Michael](https://wordpress.org/support/users/alchymyth/) * (@alchymyth) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101245) * the header text is ‘photoshopped’ into the image; * and the site title and description are hidden. * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101289) * Ok. I will give it a try. I saw a few suggestions on how to hide site title and description (some describe a line appearing after they do this). * I am not clear on the following: 1. Where I am supposed to look for the style. css, am I going to the child them (which contains the code I entered only) or the original twentytwelve theme? How does this work. 2. After I do this, what is the next step? Can you please give more direction on the suggestion below. I am new to this. * —————————————————————– When I looked at the twenty twelve theme (appearance- >editor) I did not see anything regarding “#site-title” in the style.css area.** I did see the below under header.php** * ```

" title="" rel="home">

``` * ————————————————————— The below instruction was found on the forum but once again I do not see site-title under style.css. Please advice! Thanks in advance!—————————————— go to styles.css and look for: * `#site-title {` directly underneath add `display:none;` That hides the title. * Now look for: `#site-description {` and then directly beneath that like before add: `display:none;` * Now if you want to get rid of the small space above it look for this: * ``` #header { padding: 30px 0 0 0; } and change 30px to 0 like this: #header { padding: 0 0 0 0; } ``` * _[please mark any posted code – [http://codex.wordpress.org/Forum\_Welcome#Posting\_Code](http://codex.wordpress.org/Forum_Welcome#Posting_Code)]_ * [Michael](https://wordpress.org/support/users/alchymyth/) * (@alchymyth) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101292) * 1. all changes need to be made in the child theme and its style.css; 2. no next step, after you have added/edited the styles to hide the title and description or `hgroup`; * > The below instruction was found on the forum * this is definitively for a different theme, and therefore, the css selectors of Twenty Twelve will be different. * for all these general formatting problems, try to work with a browser inspection tool such as Firebug [http://getfirebug.com/](http://getfirebug.com/) to identify what styles you need to edit. * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101300) * Great, thanks. I will give it a try and let you know how it goes. * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101318) * Hi again. THis may seem like a silly question but I majored in nursing ..so this is all foreign to me. * My twentytwelve stly.css file only has the code I inserted and nothing else. The appearance-> editor for child theme states “the child theme inherits templates from the parent theme”. So my question is below: * 1. Am I supposed to go to the parent theme as there is nothing in my style.css besides the code below, which i inserted. * It is only when I go to the parent theme that I see the style.css…thus I am not clear on what you mean when you say I should only work via the child theme… Do you mean I go to the parent theme and type the changes in the child theme I created… thus below the command below? Please help again! * /* Theme Name: Twentytwelve Child Description: Child theme for the Twenty Eleven theme Template: twentytwelve Version: 3.4.2 */ * [@import](https://wordpress.org/support/users/import/) url(“../twentytwelve/style. css”); * ——- * [Michael](https://wordpress.org/support/users/alchymyth/) * (@alchymyth) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101332) * you would need to **add **new styles to style.css of the child theme to **overwrite** the ones from the parent theme; * example: * ``` /* Theme Name: Twentytwelve Child Description: Child theme for the Twenty Eleven theme Template: twentytwelve Version: 3.4.2 */ @import url("../twentytwelve/style.css"); .site-title, .site-description { display: none; } ``` * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101366) * Great, thank you! * I am working on the ‘photoshopped’ header and will try the above codes. Will let you know how it goes… * [ian277](https://wordpress.org/support/users/ian277/) * (@ian277) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101385) * Hi all, * I can’t seem to get my twentytwelve child theme to match it’s default parent. * I’ve got this as my style.css – /* Theme Name: Twentytwelve Child Description: Child theme for the twentytwelve theme Author: Ian Template: twentytwelve */ * [@import](https://wordpress.org/support/users/import/) url(“../twentytwelve/style. css”); * but my child theme has no style as a result. I’ve created a twentyeleven child theme just fine but for some reason 2012 doesn’t work. * Thoughts? * Thanks * [Michael](https://wordpress.org/support/users/alchymyth/) * (@alchymyth) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101386) * [@ian277](https://wordpress.org/support/users/ian277/) * please [start a new topic](http://wordpress.org/support/forum/how-to-and-troubleshooting#postform) * [ian277](https://wordpress.org/support/users/ian277/) * (@ian277) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101387) * Ok, will do. Thanks alchymyth. * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101392) * Hi. PLease take a look at the changes to my site, based on the above selections. * [http://sesamesuban.com/](http://sesamesuban.com/) * I added the code, .site-title, .site-description { display: none; } to the bottom of my style.css child theme but when i pressed -update file” the title and description did not disappear. * I was able to photoshop my image but it totally changed the shape of the header, which no longer is the length of the menu bar. I would like the header size to stay the same. I tried changing the scale and also inserting 960x 250 in the appearance-> header tab, however nothing is working * …any further suggestions? Thanks! * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101402) * Hi Alchymyth, * I just looked at my site and the code you gave me works! Thanks! I am not sure why it did not update yesterday. * So …one more task to go, which is adjusting the header size. 960×250 was the suggested size, which is more rectangular. My image was more like a square. * I saw from past posts that I may have to look at the function.php file. Any further tips? * Thanks again!!! * [Michael](https://wordpress.org/support/users/alchymyth/) * (@alchymyth) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101404) * in Twenty Twelve, the coding for this is in /inc/custom-header.php * however, using a child theme, you can make the adjustments in functions.php of the child theme; * example: * ``` function twentytwelvechild_custom_header_setup() { $header_args = array( 'height' => 420 ); add_theme_support( 'custom-header', $header_args ); } add_action( 'after_setup_theme', 'twentytwelvechild_custom_header_setup' ); ``` * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101405) * Ok. I will give it a try. Thanks for the speedy response!!! I will let you know how it goes. * Thread Starter [santa2](https://wordpress.org/support/users/santa2/) * (@santa2) * [13 years, 7 months ago](https://wordpress.org/support/topic/move-header-text-into-image/#post-3101410) * Quick question Alchymyth. * I am not sure if I am to use the above code as is, or adjust the height size indicated by “420”? Please clarify. * In the event I am to adjust the height size , how do I know what to place into the child theme code. Thanks in advance! Viewing 15 replies - 1 through 15 (of 20 total) 1 [2](https://wordpress.org/support/topic/move-header-text-into-image/page/2/?output_format=md) [→](https://wordpress.org/support/topic/move-header-text-into-image/page/2/?output_format=md) The topic ‘Move header text into image’ is closed to new replies. * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/) * 20 replies * 5 participants * Last reply from: [WPyogi](https://wordpress.org/support/users/wpyogi/) * Last activity: [12 years, 12 months ago](https://wordpress.org/support/topic/move-header-text-into-image/page/2/#post-3101546) * Status: resolved ## Topics ### Topics with no replies ### Non-support topics ### Resolved topics ### Unresolved topics ### All topics