Add text widget below slider in Showcase Template

  • Author
    Posts
  • #1041803

    I’m using the Oxygen Theme. I’ve added CSS in order to remove Recent Articles and More Articles underneath the slider on my home page, but I’d like to be able to add some text below the slider. I’m using a static Showcase Template page as my home page. Can I add a widget area below the slider? Is this possible with CSS and if so, what is the code?

    Thank you so much for your help!

    The blog I need help with is antiquitynow.org.

    #1042068

    The simplest way to add plain text to that area would be to use the CSS content property. Here is an example you can start with:

    .home #content-wrap:after {
    	content: "Replace this with the tect you'd like to add."
    }
    #1042070

    Thank you so much! It worked perfectly. Is there any way to add a headline above the text? In a heading font?

    #1042087

    Is there any way to add a headline above the text? In a heading font?

    Sure. You could use :before instead of :after. You would also want to use a different selector depending on exactly what text you want to place the headline before. Here are a few examples to get you started.

    This will add large, bold text above the recent articles section:

    .home .section-title:before {
    	content: "Example Headline";
    	font-weight: bold;
    	font-size: 20px;
    }

    This will add a headline before the recent articles articles section styled in the same way the recent articles heading appears. I did this by copying the CSS used for “.section-title h1” by the theme. I found the CSS by right-clicking the recent titles heading and selecting the “Inspect Element” option.

    .home .section-title:before {
    	content: "Example Headline";
    	display: block;
    	background: #F3F3F3;
    	border-left: 10px solid #E9E9E9;
    	color: #999;
    	font-size: 1.3em;
    	line-height: 1.7em;
    	margin-bottom: 20px;
    	padding: .25em .6em .3em .6em;
    	text-transform: lowercase;
    	width: 94.5%;
    }

    You can try out these examples and adjust them until the heading looks good to you.

The topic ‘Add text widget below slider in Showcase Template’ is closed to new replies.