WordPress.org

Ready to get started?Download WordPress

Forums

How can I have two different size fonts in the page title / heading? (15 posts)

  1. dmattock
    Member
    Posted 4 years ago #

    Hi, can anyone tell me how to have two different size fonts in my page heading title. I want it to say eg "Logo design" in large font size, then "click any thumbnail to enlarge" in a smaller font size next to it ?

    Thank you

  2. Samuel B
    moderator
    Posted 4 years ago #

    hard to say without a url to site - or at least theme name

  3. dmattock
    Member
    Posted 4 years ago #

    Hi Thanks for the quick reply, sorry I should of mentioned the theme Im using is deFusion 0.9

  4. Samuel B
    moderator
    Posted 4 years ago #

    sorry - I can't get it - looks like the author is not supporting or letting you down load it

  5. dmattock
    Member
    Posted 4 years ago #

    Hey Samboll, thank you again for replying, Ive tried emailing the creator of the theme but had no reply as yet. Im not sure what to do now to fix this ?

    you can see from my page in construction http://www.davidmattock.co.uk/practice_wp/portfolio/broadcast/3d the title "3D" but i want the "click any thumbnail to view" to be smaller

    and now ive noticed the "click any thumbnail to view" appears in my drop down menu items also which i definitly dont want.
    thanks again

  6. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    if you can get to the code that shows the post title (in single.php or index.php) you could try and edit it:

    instead of what it is likely to be:
    <h3 class="post-title"><?php the_title(); ?></h3>

    you could try and use:
    <h3 class="post-title"><?php the_title(); if(is_single('3d')) { echo '<span> - click any thumbnail to view</span>'; } ; ?></h3>

    add to style.css:
    h3.post-title span { font-size: 70%; }

    and then set the page name and slug of your post to '3D' and '3d' resp.

  7. dmattock
    Member
    Posted 4 years ago #

    Thanks for the reply
    I found the code to replace with yours, my original was:

    <h3 class="post-title">
    	<a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a>
    	</h3>

    and added your line h3.post-title span { font-size: 70%; }
    to my css, but it dosnt seem to work unformtunetaly.

    I cant chage the page name to 3D as you cant use capitals in the permalink if that makes a difference ?
    thanks again

  8. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    @dmattock
    you probably edited the wrong file.

    there would have been no permalink code around the code that i suggested to be replaced.
    i don't know your file system, so i assume that this should be in single.php (?)

    and you can use capital letters in the post name, as wordpress will convert it into the slug to use in permalinks.

  9. dmattock
    Member
    Posted 4 years ago #

    Hi, thanks again for your quick reply and patience, im not too experienced in css, or wordpress

    I found the single.php but it had the same code as index with permalink in it
    <h3 class="post-title"><a href="<?php the_permalink(); ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3>

    I then thought im not using any posts or blogs and realise i should change the page-nosidebar.pho where found the correct code to change
    <h3 class="post-title"><?php the_title(); ?></h3>

    but I still cant get any result from this, not sure what im doing wrong, also when i click the permalink to try and change 3d to capitals 3D it just reverts it back to lowercase. I can use it in the page title which appears at the top of the text under my navigation, this is the slug right ?

    thanks again

  10. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    the problem could be that this is not single.php, so the if(is_single('3d') might fail to work.

    you could try to use the post id instead:

    <h3 class="post-title"><?php the_title(); $postid=$post->ID; if($postid == 88) { echo '<span> - click any thumbnail to view</span>'; } ; ?></h3>
  11. dmattock
    Member
    Posted 4 years ago #

    Oh my god, that worked ! your a genius thank you so much.
    sorry to be cheeky, but now I need to be able to do it for other pages.

    I dont want it on all pages just certain portfolio pages, like "motion graphics" "illustration" etc.. pages like "about" and "contact" dont need it on.

    I tried looking at the code but couldnt work it out. I Need it on about 5 - 7 pages in total. any ideas how I can do this ?

    Thanks again so much, and for being patient

  12. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    'motion graphics' would be postid = 18
    coudn't find 'illustration' (is that '2D' ? that would be postid = 89)

    as long as these posts are shown with 'page-nosidebar.php', then the following might work:

    <h3 class="post-title"><?php the_title(); $postid=$post->ID; if( $postid == 88 || $postid == 18 ) { echo '<span> - click any thumbnail to view</span>'; } ; ?></h3>

    the || stand for logical or

    if 'illustration' is indeed '2D' then the code would be:
    <h3 class="post-title"><?php the_title(); $postid=$post->ID; if( $postid == 88 || $postid == 18 || $postid == 89) { echo '<span> - click any thumbnail to view</span>'; } ; ?></h3>

  13. dmattock
    Member
    Posted 4 years ago #

    Thats briliant it works great, THANK YOU.
    Where do you get these postid numbers from ?

    I dont have illustration yet , but i will do and add some others, So If I know where to get these numbers from I should be able to add them myself

    thanks so much again for your speedy help, makes a forum really worth it.

  14. alchymyth
    The Sweeper & Moderator
    Posted 4 years ago #

    i use firefox and the web developer add-on; when i tick the 'css - view style information' setting, i can hover over the page and see a lot of class and id information.
    as some themes add the post-id as a css identifier to the post container, i can get this information easily.

    you could go into 'admin' 'posts' and the hover over the post title in the list - you should then see the permalink in the browser link window at the bottom left of your browser with the post-id at the end.

    another way is to look at the html fof your page from the browser:
    click 'view' 'page source' or 'ctrl U' in firefox for instance. this gives you the total html that builds your page. then go through the code until you find the title of your post, for instance:
    here is a copy of a bit from the html code of the 3D post:

    <div id="#content-left-nosidebar">
    
    			<div id="post-88" class="post-88 page hentry category-uncategorized">
    				<h3 class="post-title">3D<span> - click any thumbnail to view</span></h3>
  15. dmattock
    Member
    Posted 4 years ago #

    I just want to say thanks again so much. youve been excellent help

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.