How to add text box in the home page
-
Hi everyone.
This my website:
https://newoutlookproducts.com/I want to know how can I add words to the area under the logos, i.e. at the bottom part of the website, which is the area right above the grey footer area.
I am using the theme “Hathor”.
Please reply soon. Thank you so much!
-
You need to edit your theme files.
1. Edit file: head1.php
add this html after <!–LOGO END–>
<div class="text-logo">My New Custom Text. Change this!</div>
But if you want only show only in front page wrap with this php code:
if ( is_front_page() ) { echo'<div class="text-logo">My New Custom Text. Change this!</div>'; }
2. Edit file: style.css
Line 83 :#site-title { padding-top: 20px; float: left; <<<< DELETE THIS LINE. padding-bottom: 20px; }
3. then add in style.css to custom your new text appereance
.text-logo { /* Your custom style here */ }
Where to add–>
.text-logo {
/* Your custome style here */
}And where can I type in the words to be added?
Please reply soon. Thank you so much!
please see my edited answer.
—
.text-logo { /* Your custome style here */ }
add in very bottom style.css. Don;t forget to style it with css.
—
The words you want to be added is inside <div>:
My New Custom Text. Change this!
Use with your own words.
Good luck.
Just one more thing, as I really not familiar with the html codes…
What are the codes for altering:
color
size
bold type
align centreThank you so much for your help!!!!
So sorry!!!!
The “logo” I mean in the above is the the 6 rectangle logos.Thus, I mean I want to add some words to the area under the six logos which are actually the featured images of the posts.
Thanks!
you can use this style:
.text-logo { color: #000000; /* font color is Black */ font-size: 20px; /* increaase or decrease to suit your needs */ font-weight: bold; /* the text will be Bold */ text-align: center; /* Align the words to center */ }
You can learn about css on https://www.w3schools.com/css/css_text.asp
Good luck.
” The “logo” I mean in the above is the the 6 rectangle logos. “
well that’s different story. Sorry for my misunderstood.You have to undo the code you have edited.
For that, It will takes some time. because I will need to test on new wordpress install which I don’t have for now. Sorry. can help you quickly.
It doesn’t matter,I can wait for your solution.
Thank you so much !!!!! ??
well, hope this is works. Because I don’t know your template setting.
1. Replace file: /dummy/dummy-layout1.php with this:
<div class="row"> <div class="title"> <h2 class="blue1">Latest Post</h2></div> <div class="row"> <div class="lay1"> <?php if(of_get_option('frontcat_checkbox') == "1"){ ?> <?php if(is_front_page()) { $args = array( 'cat' => ''.$os_front = of_get_option('front_cat').'', 'post_type' => 'post', 'paged' => ( get_query_var('paged') ? get_query_var('paged') : 1), 'posts_per_page' => ''.$os_fonts = of_get_option('frontnum_select').'' ); new WP_Query( $args ); } ?> <?php }?> <?php wp_reset_postdata(); ?> <?php if(have_posts()): ?><?php while(have_posts()): ?><?php the_post(); ?> <div <?php post_class(); ?> id="post-<?php the_ID(); ?>"> <div class="post_image"> <!--CALL TO POST IMAGE--> <?php if ( has_post_thumbnail() ) : ?> <div class=" imgwrap"> <a href="<?php the_permalink();?>"><?php the_post_thumbnail('medium'); ?></a> <div class="ch-item ch-img-1 "> </div> </div> <?php echo '<div class="text-logo">' . get_post(get_post_thumbnail_id())->post_excerpt . '</div>'; ?> <?php elseif($photo = hathor_get_images('numberposts=1', true)): ?> <div class=" imgwrap"> <a href="<?php the_permalink();?>"><?php echo wp_get_attachment_image($photo[0]->ID ,'medium'); ?></a> <div class="ch-item ch-img-1 "> </div> </div> <?php echo '<div class="text-logo">' . get_post(get_post_thumbnail_id())->post_excerpt . '</div>'; ?> <?php else : ?> <div class=" imgwrap"> <a href="<?php the_permalink();?>"><img src="<?php echo get_template_directory_uri(); ?>/images/blank1.jpg" alt="<?php the_title_attribute(); ?>" class="thn_thumbnail"/></a> <div class="ch-item ch-img-1 "> </div> </div> <?php echo '<div class="text-logo">' . get_post(get_post_thumbnail_id())->post_excerpt . '</div>'; ?> <?php endif; ?> </div> <div class=" post_content2"> <div class=" post_content3"> <h2 class="postitle_lay"><a href="<?php the_permalink();?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2> <?php hathor_excerpt('hathor_excerptlength_teaser', 'hathor_excerptmore'); ?> </div> </div> </div> <?php endwhile ?> <?php endif ?> <?php get_template_part('pagination'); ?> </div> </div> </div> </div>
2. in image attachment you must fill the “Caption”.
example: https://prntscr.com/81gwsaThe text will got from that caption you filled.
3. in file style.css add this in very end:
.text-logo { color: #000000; /* font color is Black */ font-size: 20px; /* increaase or decrease to suit your needs */ font-weight: bold; /* the text will be Bold */ text-align: center; /* Align the words to center */ }
Good luck.
Sorry, it seems like the above is showing how to add words on the logos…
Actually, I just simply want to add words in the space under the logos…In the website, you can see the three logos – the red square “cufflinks & cufflinks” logo, “attitude 2020” and “rudolph alexander” in the second row, I want to add words in the space under them. The words will be a short paragraph introducing my company.
That’s why I say I want to add text box, it just like the text box in the microsoft word tht allows me to type in words…
See if you clearly understand what I mean or is that what you mean in the above!
Really really thanks for your help!!! ??
- The topic ‘How to add text box in the home page’ is closed to new replies.