Yes, I received your message. Just sent you a reply.

Hello,

Can you clarify your question please? I’m not sure I understand what you mean.

A page for email newsletter.

No, I didn’t create. Only subscription form in the footer.

Esmerald!! I’m sorry to bother but after two days of looking at it I found that the html5shiv.js was incorrectly imported.!!

Regards!!

That’s all right, Rodrigo. I’m glad you could find what caused the error.

Hello,

Can you give me the link to your page?

Thank you for your quick reply I have sent you a PM with link

Hi Emerix team, thank you for your reply. Just to understand you: do I have to change the url on every single post to the true url of each post? on line 232 under Facebook Like you currently have this code: My question is: Do I have to change http://e-merald.com/themes/emerix/single-post.html to my own url address of that particular webpage?

Say my post name is good-food.html will the new code should be:

2. How do I embed mp3 file in the template? Many thanks for your help.

Hi,

1) Yes, that’s right.The absolute URL of the page that will be liked – see the Facebook docs for details.

2) As the template already uses html5media project to make HTML5 video and audio tags work in all major browsers, just do the following:

- download the flowplayer.audio.swf and place it to “js” folder,

- embed audio into your page using the following code:

<audio src="music/audio.mp3" controls preload></audio>

Man you are a super star, it worked, thank you very much

1) Yes, “About the author” can be placed under the share icons in the single-project.html. You can take the .blog section from the single-post.html and place it fully or partially inside the .text-description section in the single-project.html.

2) Yes, you can copy the “Related Works” section in the single-project-3.html and paste it right after the .single-item-details section in the single-project.html.

3) The “related projects/works” is not a Widget because pages in HTML templates are not generated dynamically (like in a WordPress theme – using PHP). It is just created manually for each page.

thank you for your super fast response, will buy it now.

Hi,

Thanks for your interest in my product.

First of all, Emerix is not a theme – it’s an HTML template. And like all other templates in “HTML” section on Themeforest.net, it doesn’t have a Content Management System (CMS). That explains the difference in price between HTML templates and WordPress themes – $15 and $45 respectively.

In HTML template all pages are static, and each page or post/article is represented with a separate .html file. The content of a page/article can be changed by editing the corresponding .html file in a text editor (Notepad++, for example). The comments section is fully functional, except that you’ll have to insert the messages sent via the comment form manually.

Hi,

I think it’s possible, but it’s not very easy.

1) First, you need to modify all sections with media queries in each CSS file used in the template (grid.css, base.css, layout.css etc). Some of them should be deleted with the content inside – like this, for example:

@media only screen and (min-width: 480px) and (max-width: 767px) {
   ...
}

The content of others should be placed outside a media query section – like this, for example:

@media only screen and (min-width: 768px) {
   body { font-size: 13px; line-height: 22px; }
   p { margin-bottom: 15px; line-height: 22px; }
   ...
}

After modification:

body { font-size: 13px; line-height: 22px; }
p { margin-bottom: 15px; line-height: 22px; }

2) Second, delete the following line in each HTML file:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

3) Also, you need to modify some javascript files (custom.js, jquery.flexslider.min.js, jquery.masonry.min.js…). Find the sections with ”$(window).width()” code and change them appropriately.

Hi Yasamin,

Thank you!

You probably mean hiding the top bar on mobile devices in portrait mode. This can be easily changed by deleting (or commenting out) the following code in layout.css (see “Mobile Portrait Size” in section #32 “Media Queries”):

#top-bar,
#secondary-nav { display: none; }

Hello MIAADCO,

Which version of IE do you use for testing? Do I understand you right – all these problems occur when testing in this particular version of IE and only on remote server? Does the live preview work properly for you in this version of IE?

Yes, it work’s fine… So do the files that I downloaded locally….But after ftp, i tried dreamweaver, and firezilla method now..nothing!! Days wasted trying to figure it out lol!!

P.S. I’m using ie8, and i noticed….if i run in “compatibility view” the same errors occur…the top left social icons disappear…..and the slider images don’t overlay properly..

**UPDATE: Ok, I realized that this was the issue, as I noticed on my test site.. what is this compatibility issue? I’m not familiar with ie, anyway I must have broken the code some how.. and will have to re-do it.

Switching to “Compatibility View” in IE8 browser means that the web page is displayed as if you view it in IE7. As the template is not compatible with IE7 (and it is stated on the product page), there is no sense to test it in “Compatibility View”.

The issue with the slider image overlay only occurs for me in “Compatibility View” – so it’s not an error actually. The top left social icons in IE8 are loaded in most times, but sometimes not. It also concerns all Font Awesome icons – see blog.html, for example. Unfortunately, I can’t say why this happens with your website.

Okay Emerald, but what in detail I’ve to change to get the navigation arrows inside the image with a width of 800 px ? I’ve no problem to play around but I’ve absolute no idea where to begin.

Peter, in your case the positionRightSideNav function should look like this:

function positionRightSideNav() {
   if ($(window).width() >= 768) {
      var navWidth = $('#home-slider.right-side-nav .flex-direction-nav a').width(),
           navLeft = $('#home-slider').width() - navWidth;
      $('#home-slider.right-side-nav .flex-direction-nav a').css('left', navLeft + 'px');
   } else {
      $('#home-slider.right-side-nav .flex-direction-nav a').css('left', '');
   }
}

HI Emerald, thank you very much. Works perfectly. Forgot to mention how great your new template is.

Thanks for your good words, Ameol.

Just add the following style to layout.css (section #2 > Sticky menu):

body.sticky-menu-active #header .columns {
   background: url(../images/logo-small.png) no-repeat 70px bottom;
}

You can do it by changing the code something like this:

- in HTML files:

...
<div class="container">

   <div class="row">
      <div class="one-third columns">
         <div id="logo">
            ...
         </div>
      </div>
      <div class="two-thirds columns">
         --Your banner ad--
      </div>
   </div>

   <div class="full-width columns">
      <nav id="navigation">
         ...
      </nav>
   </div>

</div>
...

- in layout.css:

#logo { float: left; }
#navigation { margin-top: 30px; }
#primary-nav { }

Hello,

You set the “margin-top” property for #logo element to “-60px” using the inline CSS. I would recommend to do it inside CSS file – layout.css. In this case you can set different values of the “margin-top” property for different screen widths using media queries – like this, for example:

#logo {
   ...
   margin-top: -60px;
   ...
}

@media only screen and (max-width: 767px) {
   #logo {
      margin-top: 0;
   }
}

Hello,

1) For the detailed information on how to change the template’s color scheme, please read the “CSS Files” section of the Documentation.

2) Open custom.js file, find the “Google Maps” section, and change either address or mapCoords depending on posType chosen. More information can be found in the Documentation (“Javascript” > “Google Maps”).

Thank you! The height of the full-width homepage slider (examples 6 and 7) is set automatically and fully depends on a slide (image) size.