[new_wpParticipant]

Hello,

I’ve been searching the forum, watching the videos, reading the documentation and googling my questions but I still have some questions. My apologies if these are covered already somewhere, I’ve really tried to find them on my own and play around with WP using visual composer, the htmp text fields, shortcodes… etc.

I’m using Ethos as a blog

1. Blog Posts – is there a way to wrap the text below my audio embedded players? I’ve set the max size of the embedded player to 600px, so I assume a similar code for the text which would also wrap the text, not leave it the full width of the page. Please see my latest blog post for an example.

The other blog posts I pressed return when writing the text so it would jump to the next line but when I viewed the website on my iPhone it reminded me I can’t do that, need to wrap text.

2. Blog Posts Alignment – Is there a code I can play around with the adjust how the blog posts are horizontally aligned? There isn’t a visual composer option in the post page so I assume it’s a code.

By chance is there a universal code I can input into the customizer’s CSS section so all blog posts are aligned horizontally the same way?

3. DOWNLOADS page – similar question on the downloads page. I played around with that formatting forever. If I’d like an image/audio embedded player to by centered with text below it, what is the best way to accomplish this? For the life of me I could not get the image to just center above the text. I like the text left aligned.

4. Code for the text to be evenly distributed in the box? Not centered, right or left aligned but evenly.

5. Blog Masonry – When I set the blog to masonry in customizer each blog post appears as a blank square. Is it possible to have the audio embedded player to show up in the masonry window?

6. Social Media – just a request for Spotify & Soundcloud Icons in the next update. In the meantime any suggestions in adding my own? Would this be a social media pluggin I’d install?

Thank you in advance and sorry for such beginner questions. My hat goes off to you this s**t is difficult.

I will post my Login info in private post.

new_wp

[new_wpParticipant]

This reply has been marked as private.

[ZeshanMember]

Hi there,

Thank you for writing in!

#1: This is possible by adding the following CSS under Custom > CSS in the Customizer:

.blog .entry-wrap {
   max-width: 600px;
}

#2: You can set Masonry as your blog style under Blog > Style in Customizer (see: http://prntscr.com/4e4h6z).

Apologize, if I didn’t get this point correctly. Would you mind providing a bit more information about this point? You can share a screenshot too.

#3: For this, you can try adding the following CSS code in style=”” attribute of your [image] shortcode:

display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px;

#4: If you want to apply this to your entire website’s text, you can add the following CSS under Custom > CSS in the Customizer:

p {
   text-align: justify;
}

#5: This can be done by enabling the Enable Full Post Content on Index option under Blog Content in Customizer (see: http://prntscr.com/4e4lqq), if you see it already enabled, simply “Disable” > “Save & Publish” > “Re-enable” the option.

#6: We certainly appreciate the feedback! This is something we can add to our list of feature requests. This way it can be taken into consideration for future development. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive.

However It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer, or a service like WerkPress or Elto to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Hope this helps. 🙂

Thank you.

[new_wpParticipant]

Thank you. I’ve applied a lot of this to my site already and it’s looking great. Now that I’ve entered in the blog and post max 600px, along with the
p {
text-align: justify;
}

my footer content seems to be left aligned now, as opposed to when it was centered in the footer. Is there a way to rectify this?

I’ll attach screenshoots of the masonry issue I’m speaking about later today. Thanks again.

[Paula SMember]

Hey, no worries. I fixed the issue with the footer by assigning the justification on text on the blog entries only.

We’ll wait for your screenshots for the masonry issues and we’ll proceed from there.

[new_wpParticipant]

Hi Support,

Thank you for your help thus far. I’ve been searching through the forums, watchin those videos again and such but still have some questions. Any assistance would be appreciated. Thank you.

SOCIAL MEDIA ICONS
I now have social media icons appearing at the bottom of blog posts, but how do I get those icons to show up on the main pages (home page) under the post. This would allow someone to share the post without having to “read more”/”view more”.

Is there a way to align the icons under the blog post? I’ve been setting the posts to max width 600px.

When I hoover over the share social media icons they are highlighted in red. Is there a way to eliminate the hoover effect?

SHARING POSTS – Soundcloud player doesn’t appear
When I share a post on Facebook the audio player isn’t embedded?

MOVING POSTS to the right
By chance is there a code to ask all blog posts to move in to the right about an 1inch?

INTERNET BROWSER TAB
For some reason I have a | line in between my favicon and site name. I only notice it on the Home page tab. When I navigate to Downloads page I don’t see it.

GOOGLE SEARCH
Updating the Site Title and Tag Line – is this only changed in WP Settings > General ? I ask because when I google my site, it has a | in front of the site name. I don’t have a | in the site title in WP.

Thank you!

[CousettMember]

SOCIAL MEDIA ICONS
I would use the share shortcode with a custom excerpt for your blog entries.
Walkthrough – http://theme.co/x/member/kb/shortcode-walkthrough-share/
Shortcode Info – http://theme.co/x/demo/integrity/1/shortcodes/entry-share/

Thanks for writing in!

You will need to add some CSS code under Appearance -> Customize -> Custom -> CSS

.x-entry-share .x-share:hover {
background-color: red;
}

Change “red” for whatever color you are looking for either in its short name or hex value.

SHARING POSTS
This is how Facebook embeds the post as far as I know there is not really a way to change this.

MOVING POSTS
You will need to add some CSS code under Appearance -> Customize -> Custom -> CSS

.entry-content {
margin-left: 20px;
}

INTERNET BROWSER TAB & GOOGLE SEARCH
Yes these are coming from the WP Settings -> General change the site title and tag line here and it will change on the browser bar and google.

I hope these items helped.

[ZeshanMember]

Hi there,

Thank you for writing in!

#1: This can be achieved by custom development. Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

After that, copy the file wp-content/themes/x/framework/views/ethos/content.php into your child theme’s folder /framework/views/ethos/, open in a text editor and add the following line at the bottom of the file:

<?php if( !is_single() ) x_portfolio_item_social(); ?>

To align the social icons, simply add the following CSS code under Custom > CSS in the Customizer:

.x-entry-share {
   max-width: 600px;
   margin-left: 90px;
}

#2: Regretfully this isn’t a feature offered by X. It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer, or a service like WerkPress or Elto to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

#3: Please add the following CSS:

.post .entry-wrap {
   margin-left: 90px;
}

#4 & #5: I’d recommend using using “WordPress SEO by Yoast” plugin to fix this problem: https://wordpress.org/plugins/wordpress-seo/

#6: The issue with the Footer Text in our first message: Please replace the following CSS code:

p {
   text-align: justify;
}

with:

.entry-wrap p {
   text-align: justify;
}

Hope this helps. 🙂

Thank you.

[new_wpParticipant]

Thank you for your reply.

In regards to your answer about #1
“#1: This can be achieved by custom development. Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

After that, copy the file wp-content/themes/x/framework/views/ethos/content.php into your child theme’s folder /framework/views/ethos/, open in a text editor and add the following line at the bottom of the file:

<?php if( !is_single() ) x_portfolio_item_social(); ?>”

I uploaded the child theme before I posted the last set of questions. I went ahead and copyed the content.php and added <?php if( !is_single() ) x_portfolio_item_social(); ?> into the child theme, but do I know upload this Child theme again? Sorry, stupid question but I just want to make sure. Also, if I do reupload do I just ADD NEW THEME, not delete the current child theme installed?

SOCIAL MEDIA HOOVER COLOR
This is the code I was given above:
.x-entry-share .x-share:hover {
background-color: red;
}

Is there a way to adjust it so when the mouse is hoovering above it only lights up the icon body, like the social media icons in the footer. Currently it places this box around the icon, I’m not a fan of that.

[new_wpParticipant]

I’m sorry, this also just came to mind:
Can I edit the social media code I cut and pasted into the child theme to add in other social media platforms that weren’t part of the default code? Like Tumblr, Instagram?

<?php echo do_shortcode( ‘[share title=”Share this Post” facebook=”true” twitter=”true” google_plus=”true” reddit=”true” email=”true”]’ ) ?>

GOING FORWARD
If a year from now there is another social media platform that I’d like to add to the “Share this post” section I should just do the same thing? Edit the child theme and reupload to themes?

THANK YOU!

[ZeshanMember]

Hi there,

Thank you for writing in!

#1: You don’t need to upload complete child theme. Just upload the file you have made changes in (i.e. content.php from your child theme) to the right location using FTP or file manager.

#2: Please add the following CSS code to achieve this:

.x-entry-share .x-share:hover {
   background-color: transparent;
   color: #045f93;
   opacity: 0.8;
}

You can adjust opacity: 0.8; (0 – 1) to adjust transparency level.

#3 & #4: It could be possible with custom development, but this would be outside the scope of support we can offer. You may wish to consult a developer, or a service like WerkPress or Elto to assist you with this. X is quite extensible with child themes, so there are plenty of possibilities.

Hope this helps. 🙂

Thank you.

[new_wpParticipant]

Hi there,

Thank you for clarifying.

#1 I now have some social media icons showing up on the front page which is great however, not all of them. I copied this code into the child theme wp-single:

<?php echo do_shortcode( ‘[share title=”Share this Post” facebook=”true” twitter=”true” google_plus=”true” reddit=”true” email=”true”]’ ) ?>

but now only facebook and twitter icons show up on the front page. Please see here http://prntscr.com/4ewhak

On the post page (so when I click on the post from the front page) all the social media icons appear http://prntscr.com/4ewfal

#2 I also now have extra horizontal thin lines that show up on each post page and on the front page. There is now a thin line above the social media icons and below it. So 3 thin lines when there used to just be one. Please see a screenshot here: http://prntscr.com/4ewf0k

Is there a way to get ride of two of those lines? or all of them? Thank you.

#3 CUSTOM SOCIAL MEDIA ICONS
I’ve created and uploaded social media icons. Is there a way to adjust their color so they somewhat blend in next to the icons that are part of Ethos? Please see here http://prntscr.com/4ewvmq

#4 SOCIAL MEDIA ICONS IN HEADER
I’ve seen in the forum there is CSS and altering a file in theme to post social media icons at the very top of the page but is there a way to have social media icons appear in the actual header? For instance to the right of the search icon in the header.

THANK YOU!

[new_wpParticipant]

Thank you for the moving text css code:
.entry-content {
margin-left: 20px;
}

Is there a way to alter this code so it only applies to viewing on a desktop/laptop. Viewing the site on mobile now looks odd with that code. Thank you!

[Paul RModerator]

Hi,

You can add this under Custom > CSS in the Customizer.

@media (max-width: 979px){
    .entry-content {
         margin-left: 0;
    }
}

[new_wpParticipant]

Hi Support,

Unfortunately, this code doesn’t work correctly:
@media (max-width: 979px){
.entry-content {
margin-left: 0;
}
}

I tried adjusting it for an iphone 4 screen width which is 640px
@media (max-width: 640px){
.entry-content {
margin-left: 0;
}
}

however the posts still are misaligned.

Are you able to answer the questions I’ve listed on August 21, 2014 at 1:54 am #89060. I don’t mean to rush you, just want to make sure that set of questions wasn’t accidentally skipped. Thank you.

[Author]

Posts